是否可以使用范围:true从Angular Directive更新父范围。

【字号: 日期:2024-02-05浏览:23作者:雯心
如何解决是否可以使用范围:true从Angular Directive更新父范围。?

尽管@user1737909已经引用了SO问题来阅读(AngularJS中范围原型/原型继承的细微差别是什么?它将解释该问题并建议各种解决方法),但我们通常会尝试在SO上给出答案。

因此,您的小提琴无法工作的原因是因为在将原始类型(例如,字符串,数字或布尔类型)写入(例如,scope.name =newName)“写入”时,总是将其转到本地范围/对象。换句话说,子作用域获得了自己的name属性,该属性遮盖了同名的父属性。解决方法是在父范围内使用一个对象,而不是原始类型。然后,子作用域将获得对该对象的引用。对对象属性的任何写入(无论是从父对象还是从子对象)都将转到该对象。(子作用域没有得到自己的对象。)

$scope.obj = {name: ’Dave’};

然后在您的指令中:

scope.obj.name = newName;

和HTML:

Hello, {{obj.name}}!

[fiddle](http://jsfiddle.net/mrajcok/c8pZs/)

解决方法

我需要从指令中的父控制器继承范围。我不一定要离开范围:false。我也不一定要使用孤立的作用域,因为要获得我确实关心的值正确链接(需要在父控制器中考虑很多值),就需要大量的工作。

scope:true如果要更新父范围,在我的指令中使用是否有意义?

<div ng-controller='MyCtrl'> Hello,{{name}}!<my-directive></my-directive></div>var myApp = angular.module(’myApp’,[]);//myApp.directive(’myDirective’,function() {});//myApp.factory(’myService’,function() {});function MyCtrl($scope) { $scope.name = ’Dave’;}myApp.directive(’myDirective’,function() { return {scope: true,restrict: ’EA’,link: function(scope,elem,attrs) { scope.updateName = function(newName) {console.log(’newName is: ’ + newName);scope.name = newName; }},template: ’<input ng-model='updatedName' placeholder='new name value'> <button ng-click='updateName(updatedName)'>Update</button>’ }})

请检查小提琴

相关文章: