2013-12-18 2 views
3

У меня угловая директива использует оператор = для двухсторонней привязки изолированного объема с атрибутом его родительской области:Удаления объекта, на который ссылается области действия внутри изолированного объема - angular.js

app.directive('nestedDirective', function(){ 
    return { 
     scope: { 
      model: '=' 
     }, 
     link: function($scope){ 
      ... 
     } 
    } 
}); 

I что любые изменения в $ scope.model будут распространяться на родительскую область. Однако удаление $ scope.model не распространяется. delete($scope.model) Мой вопрос: как удалить ссылочную переменную и распространить ее на родительскую область.

This codepen должен проиллюстрировать то, что я пытаюсь сделать, не (даже не наблюдая за рамки пожары событие)

+0

«Однако удаление $ scope.model не распространяется». Как удалить '$ scope.model'? – Neozaru

+0

delete ($ scope.model), я бы хотел узнать более хороший способ сделать это. Вы можете увидеть это в кодефене: http://codepen.io/goodafternoon/pen/rneKa – nimrod

+0

Возможно, вы удаляете структуру «$ scope.model», но не значение, указанное этой структурой. Попробуйте $ scope.model = null – Neozaru

ответ

2

Этот вопрос спрашивают очень, очень часто, так что я начну, ссылаясь на wiki article.

В основном, следует «точечному правилу»: если вам нужно изменить свойство (непосредственно), объем его под другое свойством, так что JS прототипичное наследование может загнуться:

var model = {prop: "val"}; 
var a = {model: model}; 

model = null; 
console.log(a.model.prop); // prints val 

var b = {a: a}; 
a.model = null; 

console.log(b.a.model); // prints null 

Это то же самое здесь (даже если это не использует прототипное наследование, чтобы все было просто).

+0

, но это не совсем то же самое, если вы посмотрите на код, о котором я говорил: http://codepen.io/goodafternoon/pen/rneKa вы можете видеть, что элемент, который я пытаюсь удалить, является частью массива в области с родителями, а также цель создания областей выделения в угловом - это изолировать их, продвижение прототипа цепи поражает эту цель. – nimrod

+0

Вы не можете отменить то, на что у вас нет контроля. Просто модель пространства имен и изолируйте это. – Ven

1

Я редактировал ваш исходный код пера ниже, я уверен, что есть более простой способ сделать это, но я просто попытался это, и она работает, он должен начать Вас на правильном пути:

<ul ng-app="app" ng-controller="ctrl"> 
    <dir model="data.children" child="child" ng-repeat="child in data.children"></dir> 
</ul> 

var app = angular.module('app', []); 

app.controller('ctrl', function($scope){ 
    $scope.data = {}; 
    $scope.data.children = [ 
    {name: 'Ben'}, 
    {name: 'Heffler'}, 
    {name: 'Schubert'} 
    ]; 

    $scope.$watchCollection('data.children', function(){ 
    console.log("children shallow watch", $scope); 
    }); 
    $scope.$watch('data.children', function(){ 
    console.log("children deep watch",$scope); 
    }, true); 
}); 

app.directive('dir', function(){ 
    return { 
    restrict: 'E', 
    scope: { 
     model: '=', 
     child:'=' 
    }, 
    replace: true, 
    template: '<div>{{child.name}} <button ng-click="remove()">Remove</button></div>', 
    link: function(scope, element, attrs){ 
     scope.remove = function(){ 
     // I'm just deleting the first one as an example. 
     delete(scope.model[0]); 
     console.log("children inner scope", scope) 
     } 
    } 
    }; 
}); 

Я не уверен, почему вы хотите удалить свойства, но я уверен, что у вас есть свои причины, просто чтобы показать вам, что это возможно.

EDIT

Вот отредактированный код ручки (см журналы консоли, чтобы увидеть удаленные элементы в объеме). http://cdpn.io/Ghmvk

Смежные вопросы