Устранение двусторонней привязки AngularJS не работает должным образом в директиве

Question

Я пытаюсь реализовать список радиокнопок с использованием ng-repeat. typeList.html

<div ng-repeat="type in types" > 
    <input type="radio" id={{type.id}} name="{{type.name}}" ng-model="result" ng-value="type.id" > 
    {{type.name}} 
    <div> Result {{result}} </div> //result is changing only in the row of clicked radio-button. It should change in every row.(two way data-binding). 
</div> 

Директива:

angular.module('app').directive('myList',function(){ 
     return{ 
      restrict: 'A', 
      scope: { 
       types: '=', //here list is passed to be printed with ng-repeat 
       result: '=' //here I want to store which radio-button was selected last time by id 
      }, 
      templateUrl: 'html/typeList.html' 
     }; 


    }); 

Директива имеет изолированный объем. Я передаю два параметра. Список для печати с помощью переключателей и объекта результата, в котором хранится ответ (id-какой переключатель был нажат в последний раз) в родительской области. К сожалению, всякий раз, когда я нажимаю на радиокнопки, мой результат меняется только локально.

Passing parameters to my directive. 
<div my-list types="list" result="selected"></div> 



    Passed list and result paramater from controller to myList directive. 

$scope.list = [ 
     { id: 1, name:'Name 1' }, 
     { id: 2, name:'Name 2' }, 
     { id: 3, name:'Name 3' } 
    ]; 

$scope.selected = -1; 

Я был бы признателен за любую помощь.

Answer 1

Вы должны пройти не-примитивный объект модели, чтобы получить свою ссылку для связывания две войны. Просто оберните selected в объект для его ссылки.

В вашем контроллере использовать.

$scope.list = [{ 
    id: 1, 
    name: 'Name 1' 
    }, { 
    id: 2, 
    name: 'Name 2' 
    }, { 
    id: 3, 
    name: 'Name 3' 
    }]; 
    $scope.ctrlModel = { 
    selected: -1 
    } 

И в разметке, которая 'html/typeList.html'

<div ng-repeat="type in types" > 
    <input type="radio" id={{type.id}} ng-model="result.selected" ng-value="type.id" > 
    {{type.name}} 
</div> 
Result {{result.selected}} 

Рабочей Fiddle Demo

Надеется, что это помогает.

Answer 2

пытаются иметь область видимости переменных в качестве объекта как

$scope.types = { list: {}, selected: 'radioValueThatNeedsToBeSelected' }