如何從指令中動態更新ng-model？

我是Angular的新手，無法弄清楚我在做什麼錯誤，同時試圖讓ng模型顯示一個對象值。如何從指令中動態更新ng-model？

目標：

我想創建一個指令，讀取對象，並生成基於對象的數據單選按鈕。這個對象的內部我有{logAs：'radioGroupName'}。這應該被存儲到另一個名爲formData的對象中。

實施例：

{logAs: 'dog', options: [{option: 'poodle'}, {option: 'pitbull'}]}

這應該創建兩個單選按鈕，一個用於pittbull，另一個用於貴賓犬。兩者都應該有ng模式設置爲狗。如果用戶選擇了貴賓犬則在FORMDATA對象最終輸出應該是：

{dog: 'poodle'}

的問題：

我相信我接近，一切正常，除了NG-模型罰款。裏面NG-模型的實際對象的值（狗）不會出現，因爲我想，不是我弄，我在輸入的對象路徑

這是我的html：

<div ng-app="test"> 
    <div ng-controller="myController"> 
    <p>formData: {{formData}}</p> 
    <h3>Static (updates formData)</h3> 
    <input type="radio" ng-model="formData.dog" value="pitbull"> Pitbull<br/> 
    <input type="radio" ng-model="formData.dog" value="Bull Dog"> Bull Dog<br/> 
    <input type="radio" ng-model="formData.dog" value="Poodle"> Poodle 

    <h3>Dynamic (wont update formData)</h3> 
    <directive form="formInfo"></directive> 
    </div>

這是JavaScript：

angular.module('test', []) 
.controller('myController', function($scope){ 
    $scope.formData = {}; 
    $scope.formInfo = { 
    title: 'What type of dog do you have?', 
    logAs: 'dog', 
    options: [{option:'Pitbull'}, {option: 'Bull Dog'}, {option:'Poodle'}] 
    } 
}) 

.directive('directive', function(){ 
    return { 
    restrict: 'E', 
    template: '{{form.title}}<div ng-repeat="option in form.options"> <input type="radio" ng-model="form.logAs" value="jack" > {{option.option}}</div>', 
    scope: { 
     form: '=' 
    } 

    } 
});

我怎樣才能NG-模型顯示對象（「狗」），而不是對象路徑的輸出？ 這裏是一個fiddle

來源

2017-09-19 Juan Arciniega

-1

在你的小提琴，這是因爲在HTML的第3行，你有{{formData}}當它應該是{{formData.dog}}

來源

2017-09-19 22:41:22 Pytth

仍然是錯誤的。如何顯示'formData'與指令無法按預期工作無關。 –

@ChrisG他的問題的倒數第二行提問是什麼？這是粗體。在標題爲「問題」的部分 - 也用粗體顯示 - 這是什麼意思？ – Pytth

它隱含地說，就像它在小提琴中拼出來的一樣，單擊單選按鈕不會更新'formData'。 OP已經發現了這個問題：基於模板生成的HTML看起來並不像他期望的那樣。當你真正知道你在說什麼時，你應該只使用傲慢。 –

如何從指令中動態更新ng-model？

回答

相關問題