我已经成功地从其余调用中填充了数据,之后我可以通过使用其 id 点击点击事件来获取该数据的详细信息。我可以在控制台中打印数据,但无法将其绑定(bind)到模板中。这是我的代码。
service.js:
(function() {
angular.module('myApp').service('registerService', registerService,restService);
var baseUrl:"http://localhost:xxxxxxxxxxx"
function registerService($q, $http) {
//var category={};
var deferred = $q.defer();
//function to get all category
this.getAllCategory = function () {
//calling json data
return $http.get(baseUrl).then(function (response) {
category = response.data;
deferred.resolve(category);
return deferred.promise;
},
function (error) {
deferred.reject(error);
return deferred.promise;
});
},
//function to get category by id
this.getSubCategory = function (id) {
console.log('inside subcategory');
return $http.get(baseUrl + '/' + id)
.success(function (response) {
deferred.resolve(response.data);
return deferred.promise;
},
function (error) {
deferred.reject(error);
return deferred.promise;
});
};
}
})();
controller.js:
(function () {
angular.module('shoppingPad').controller('registerCtrl', registerCtrl);
function registerCtrl($scope, registerService, $stateParams, $state, Page) {
// var categoryId = $stateParams.categoryId;
$scope.category = null;
$scope.cur_category = null;
//getCategory function to get all category from rest call.
$scope.getCategory = function () {
//setting title for registration
Page.setTitle('Registration');
registerService.getAllCategory().then(function (response) {
$scope.category = response;
console.log($scope.category);
})
};
//passing id to subCategory function to get sub category by id
$scope.subCategory = function (id) {
//setting title for sub-category
Page.setTitle('Sub-Register');
registerService.getSubCategory(id).then(function (data) {
console.log(data);
$scope.cur_category = data;
console.log($scope.cur_category);
$state.go('app.home.register3', {'categoryId': id})
});
};
$scope.signin = function () {
$state.go('app.login.step1')
}
}
})();
registration-2.html:
<md-content ng-controller="registerCtrl">
<h3 class="Select-Sub-category">Select Sub-Category</h3>
<div layout="row" layout="column" flex=100" style="width:200px;">
<div style="margin-left:16px" class="Rectangle-425-Copy-3" flex-gt-sm="50">
<span class="RETAIL">{{cur_category.name}}</span>
</div>
</div>
</md-content>
在 app.js 中我定义了这样的状态:
$stateProvider.state('app.home.register2', {
url: "/register",
templateUrl: 'template/register/registration-1.html',
controller: 'registerCtrl',
})
.state('app.home.register3', {
url: "/register/{categoryId:[0-9]{1,5}}",
templateUrl: 'template/register/registration-2.html',
controller: 'registerCtrl'
})
最佳答案
您必须在 register.js 中创建另一个调用 subCategory() 的函数。 用这个更新你的代码它将起作用。
var categoryId=$stateParams.categoryId;
$scope.categoryData=function(){
$scope.subCategory(categoryId);
}
并在您的registration-2.html中调用此函数。
<md-content ng-init="categoryData()">
<h3 class="Select-Sub-category">Select Sub-Category</h3>
<div layout="row" layout="column" flex=100" style="width:200px;">
<div style="margin-left:16px" class="Rectangle-425-Copy-3" flex-gt-sm="50">
<span class="RETAIL">{{cur_category.name}}</span>
</div>
</div>
</md-content>
关于javascript - 如何使用休息调用将 Controller 中的数据绑定(bind)到 Angular View ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37386307/