控制器和指令,优先级
Controllers and directives, precedence
我已经使用 Angularjs 几天了,我正在努力解决它的几个方面。我会尽力解释问题所在,非常感谢任何人能给我的帮助。
我的情况(简体)是这样的:
我有一项服务可以从 json 加载一些信息并将其存储在一个对象中。它还有一些功能可供其他控制器用来检索该信息。
var particServices = angular.module('particServices', []);
particServices.service('particSrv', function() {
var data = {};
this.updateData = function(scope) {
data = // http call, saves in data
}
this.getName = function(code) {
return data.name;
}
});
我有一个由控制器辅助的 html 页面,它使用指令板(没有参数,非常简单)。这是控制器:
var bControllers = angular.module('bControllers', []);
bControllers.controller('bController', ['$scope', 'particSrv', function ($scope, particSrv) {
$scope.getName = function(code) {
return particSrv.getName(code);
};
particSrv.updateData($scope);
}]);
如您所见,控制器调用初始化服务中的对象。由于这是一个单例,我知道一旦加载了信息,就不需要对 updateData 进行其他调用,并且其他人可以使用服务中的 getter(在本例中为 getName)获得该信息。
我有一个非常简单的指令板(我在这里进行了简化),它使用了另一个指令 bio。
angular.module('tsDirectives', [])
.directive('board', ['dataSrv', 'particSrv', function(dataSrv, particSrv) {
return {
restrict: 'E',
replace: true,
scope: true,
controller: function($scope) {
$scope.getName = function(code) {
return particSrv.getName(code);
};
dataSrv.updateData($scope, 'board', 'U');
},
templateUrl: '<div class="board"><div bio class="name" partic="getName(code)"/></div></div>'
};
}]);
这是 bio 指令:
angular.module('gDirectives', [])
.directive('bio', function() {
return {
scope: {
partic: '&'
},
controller: function($scope) {
$scope.name = $scope.partic({code: $scope.athid});
},
template: '<a ng-href="PROFILE.html">{{name}}</a>'
};
})
现在,我期望的是在 bio 指令中显示了从派对检索到的信息,但显然这个指令是在主控制器中初始化 partic 之前处理的。
我的印象是,即使在处理指令时仍未加载此信息,一旦服务完成并且信息准备就绪,它就会自动出现在我的指令中,但这似乎不是那样工作。我一直在阅读有关 $watch 和 $digest 的文章,但我不明白为什么(以及是否)我需要手动调用它们来解决这个问题。
任何提示将不胜感激。如果需要,我可以提供更多技术细节。
指令将在应用程序加载时初始化,用户打开该指令所在的页面,如果您稍后设置了一些 属性(例如 api),它将更新该指令属性 在指令中,但不会重新初始化该指令($scope.partic({code: $scope.athid}) 不会被调用)。
如果你想让指令等待初始化,你应该使用 ng-if。像这样:
<div data-directive-name data-some-property="someProperty" data-ng-if="someProperty"></div>
在这种情况下,当(如果)您在 $scope.someProperty 中有一些值时,指令将被初始化。但是,如果您可以为 someProperty 设置假值,这就不是很好了。
在那种情况下,您需要使用某种加载标志。
您没有将 "particServices" 作为依赖项包含在使用 "particServices" 服务的其他模块中。您的模块应该如下所示:
var bControllers = angular.module('bControllers', ['particServices']);
angular.module('tsDirectives', ['particServices']);
angular.module('gDirectives', ['particServices']);
我已经使用 Angularjs 几天了,我正在努力解决它的几个方面。我会尽力解释问题所在,非常感谢任何人能给我的帮助。
我的情况(简体)是这样的:
我有一项服务可以从 json 加载一些信息并将其存储在一个对象中。它还有一些功能可供其他控制器用来检索该信息。
var particServices = angular.module('particServices', []);
particServices.service('particSrv', function() {
var data = {};
this.updateData = function(scope) {
data = // http call, saves in data
}
this.getName = function(code) {
return data.name;
}
});
我有一个由控制器辅助的 html 页面,它使用指令板(没有参数,非常简单)。这是控制器:
var bControllers = angular.module('bControllers', []);
bControllers.controller('bController', ['$scope', 'particSrv', function ($scope, particSrv) {
$scope.getName = function(code) {
return particSrv.getName(code);
};
particSrv.updateData($scope);
}]);
如您所见,控制器调用初始化服务中的对象。由于这是一个单例,我知道一旦加载了信息,就不需要对 updateData 进行其他调用,并且其他人可以使用服务中的 getter(在本例中为 getName)获得该信息。
我有一个非常简单的指令板(我在这里进行了简化),它使用了另一个指令 bio。
angular.module('tsDirectives', [])
.directive('board', ['dataSrv', 'particSrv', function(dataSrv, particSrv) {
return {
restrict: 'E',
replace: true,
scope: true,
controller: function($scope) {
$scope.getName = function(code) {
return particSrv.getName(code);
};
dataSrv.updateData($scope, 'board', 'U');
},
templateUrl: '<div class="board"><div bio class="name" partic="getName(code)"/></div></div>'
};
}]);
这是 bio 指令:
angular.module('gDirectives', [])
.directive('bio', function() {
return {
scope: {
partic: '&'
},
controller: function($scope) {
$scope.name = $scope.partic({code: $scope.athid});
},
template: '<a ng-href="PROFILE.html">{{name}}</a>'
};
})
现在,我期望的是在 bio 指令中显示了从派对检索到的信息,但显然这个指令是在主控制器中初始化 partic 之前处理的。
我的印象是,即使在处理指令时仍未加载此信息,一旦服务完成并且信息准备就绪,它就会自动出现在我的指令中,但这似乎不是那样工作。我一直在阅读有关 $watch 和 $digest 的文章,但我不明白为什么(以及是否)我需要手动调用它们来解决这个问题。
任何提示将不胜感激。如果需要,我可以提供更多技术细节。
指令将在应用程序加载时初始化,用户打开该指令所在的页面,如果您稍后设置了一些 属性(例如 api),它将更新该指令属性 在指令中,但不会重新初始化该指令($scope.partic({code: $scope.athid}) 不会被调用)。
如果你想让指令等待初始化,你应该使用 ng-if。像这样:
<div data-directive-name data-some-property="someProperty" data-ng-if="someProperty"></div>
在这种情况下,当(如果)您在 $scope.someProperty 中有一些值时,指令将被初始化。但是,如果您可以为 someProperty 设置假值,这就不是很好了。
在那种情况下,您需要使用某种加载标志。
您没有将 "particServices" 作为依赖项包含在使用 "particServices" 服务的其他模块中。您的模块应该如下所示:
var bControllers = angular.module('bControllers', ['particServices']);
angular.module('tsDirectives', ['particServices']);
angular.module('gDirectives', ['particServices']);