自定义指令不会在 ui-grid 的 cellTemplate 中更新
Custom directive doesn't get updated inside cellTemplate of ui-grid
我在 ui-grid
的 cellTemplate
中使用名为 flag
的自定义指令。该指令只接受国家名称(美国或加拿大),并显示其相应的标志。当页面第一次加载时,该指令工作正常。但是,以后即使我将标志的值更改为任何值,自定义指令也不会更新并显示新标志。不确定我错过了什么。
指令被编译一次!您需要查看属性或设置双向绑定!
app.directive('flag', function() {
var flags = {
USA: 'https://github.com/hjnilsson/country-flags/raw/master/png100px/us.png',
CANADA: 'https://github.com/hjnilsson/country-flags/raw/master/png100px/ca.png'
};
return {
restrict: "A",
scope: {
flag: "@"
},
link: function(scope, elem, attrs) {
scope.$watch('flag', function(newValue, oldValue){
angular.element(elem).attr('src', flags[newValue]);
});
}
};
});
工作plunkr ==> http://plnkr.co/edit/dcHDMEY8MpQnCnm99aDd?p=preview
我在 ui-grid
的 cellTemplate
中使用名为 flag
的自定义指令。该指令只接受国家名称(美国或加拿大),并显示其相应的标志。当页面第一次加载时,该指令工作正常。但是,以后即使我将标志的值更改为任何值,自定义指令也不会更新并显示新标志。不确定我错过了什么。
指令被编译一次!您需要查看属性或设置双向绑定!
app.directive('flag', function() {
var flags = {
USA: 'https://github.com/hjnilsson/country-flags/raw/master/png100px/us.png',
CANADA: 'https://github.com/hjnilsson/country-flags/raw/master/png100px/ca.png'
};
return {
restrict: "A",
scope: {
flag: "@"
},
link: function(scope, elem, attrs) {
scope.$watch('flag', function(newValue, oldValue){
angular.element(elem).attr('src', flags[newValue]);
});
}
};
});
工作plunkr ==> http://plnkr.co/edit/dcHDMEY8MpQnCnm99aDd?p=preview