我的指令：
(function () {
var directive = function ($compile, $http, $rootScope, $translate) {
return {
restrict: 'E',
scope: {
baseUrl: '@rmsUrl',
},
link: function (scope, element, attrs) {
$rootScope.languageSwitcher = {
toggle: true,
changeLanguage: function () {
if ($rootScope.languageSwitcher.toggle) {
$translate.use('ENG');
} else {
$translate.use('FRE');
}
}
}
$rootScope.$on('oauth2:authSuccess', function (data) {
var html2 = 'French <label class="switch">'
html2 += '<input type="checkbox" ng-model="languageSwitcher.toggle" ng-change="languageSwitcher.changeLanguage()" /><div></div>'
html2 += '</label>English'
element.html(html2);
$compile(element.contents())(scope);
});
}
};
};
angular.module('testingApp')
.directive('rmsLanguageToggler', directive);
}());
我的索引文件包含指令：
<rms-language-toggler rms-url='blah blah blah'></rms-language-toggler>
我的问题：
html 正确呈现，但是更改/单击复选框不会触发该功能：$rootScope.languageSwitcher.changeLanguage()
我现在知道为什么了。原来指令中的 ng-change 和 ng-model 仍然引用内部隔离范围。我必须使用 $parent。访问外部模型，即 $parent.languageSwitcher.toggle
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句