Angularjs Проблемы с двусторонней привязкой

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

<div ng-controller="OtCtrl">
     <div ng-include src="'/client/views/openTradeView.html'"></div>
</div>

мой взгляд:

<div>
    {{name}}
    <div swings binding="Risk" title="Risk"></div>
    <div swings binding="Amount" title="Amount"></div>
</div>

Это мой директивный вид:

<div>
    {{title}} 
    <a href="javascript:void(0)" ng-click="minus()">-</a>
    {{amount}}
    <a href="javascript:void(0)" ng-click="plus()">+</a>
</div>

Это моя директива:

app.directive("swings", function () {
return {
    replace: true,
    scope: {
        title : '@title',
        amount: '=binding',
        extra: '=bindingExtra'
    },
    resctrict: "A",
     controller: function($scope){

        $scope.minus = function (event, binding) {
            $scope.amount -= 1;
            console.log(binding)
        }
        $scope.plus = function (event) {
            $scope.amount += 1;
        }
    },
    templateUrl: '/client/views/swingsDirectiveView.html'
}
});

И, наконец, мой контроллер:

app.controller("OtCtrl", ['$scope', function ($scope) {
    $scope.Amount = 400;
    $scope.Risk = 100;

    setInterval(function(){
       console.log($scope.Risk)
    },2000);
}]);

Я знаю, что когда я использую ng-view, angularjs создает новую область видимости. Моя проблема заключается в том, что когда я нажимаю «плюс» или «минус», сумма в директиве обновляется, но модель риска в контроллере нет, но при первой загрузке директива принимает значение инициализации риска и устанавливает сумму.

Как я могу решить эту проблему.

Спасибо


person Arnold    schedule 01.05.2013    source источник
comment
Я не уверен, что понимаю ваш вопрос. Я создал плункер с вашим кодом, и, кажется, он работает нормально, но, возможно, вы можете переформулировать свой вопрос. Должно быть что-то, что я упускаю. Вот планк: plnkr.co/edit/9OXRGJ?p=preview   -  person Jason Aden    schedule 01.05.2013


Ответы (1)


Я бы предложил создать свойство model в вашем контроллере следующим образом:

app.controller("OtCtrl", ['$scope', function($scope) {
  $scope.model = {
    Amount: 400,
    Risk: 100
  }
}]);

Затем привяжите его к своей директиве через:

<div swings binding="model.Risk" title="model.Risk"></div>

Скорее всего, наследование области действия создает копию Amount и Risk (поскольку они являются примитивами); в то время как создание подобного объекта приводит к копированию ссылки, что означает, что иерархия областей действия использует одни и те же данные.

person FMM    schedule 01.05.2013