在angularjs應用程序中默認選擇單選按鈕

請找到單選按鈕的plunker。我期待當我選擇單選按鈕時，從$scope.itemList中選擇的對象被分配到selectedItemDetails，但它沒有發生。另外，默認情況下，當頁面加載時，我希望根據var tagNumTobeSelectedByDefault = 2;選擇默認單選按鈕，即"Gety of House"默認情況下會被選中，我該怎麼做？在angularjs應用程序中默認選擇單選按鈕

我收到對象的索引，從列表中選擇如下：

var indexObjectTobeSet = $scope.itemList.map(function(x) { 
    return x.tagNum; 
}).indexOf(tagNumTobeSelectedByDefault);

但是，如果不設定特定的單選按鈕。

來源

2015-12-11 Madasu K

當您聲明selectedItemDetails爲空文字{}時，您沒有特定的綁定。聲明屬性的ng-model可以連接到：

$scope.selectedItemDetails = { selected : null }

和

<input type="radio" ng-model="selectedItemDetails.selected" name="eachCat" data-ng-value="eachCat">

然後，它的工作原理。現在，你也可以用

$scope.selectedItemDetails = { selected : $scope.itemList[3] }

http://plnkr.co/edit/9hVxlhzvCmx3PIsbImVD?p=preview

來源

2015-12-11 16:18:30 davidkonrad

但默認情況下，即使我用$ scope.selectedItemDetails = {scope：selected：null}替換$ scope.selectedItemDetails = {selected：null}，單選按鈕中的「Gety of House」 { 「subNum」：1222，「變量名」：「房子的傑蒂」，「tagNum」：2，「slList」：空 }} –

@MadasuK - 即使你有類似的文字ŧ嘿是不同的對象！使用選擇：'$ scope.itemList [index]'。你用'ngRepeat'迭代'itemList'，所以當你設置默認的選定單選按鈕時，使用'itemList'的引用。 – davidkonrad

您不設置索引，您將selectedItemDetails的值設置爲$scope.itemList陣列中要選擇的實際對象。因此，

$scope.selectedItemDetails = $scope.itemList.filter(function(item) { return item.tagNum === tagNumTobeSelectedByDefault; })[0];

應該工作（只記得把它的$scope.itemList定義後）。你甚至可能會考慮將itemList對象轉換爲服務或常量。

來源

2015-12-11 16:16:52

默認選擇是工作正常，但之後設置默認選擇的無線電項目，如果我改變的單選按鈕選擇「selectedItemDetails」是不是反映了變化。 –

它似乎與您現在使用的解決方案一起工作（用ng-model =「selectedItemDetails.selected」替換'ng-model =「selectedItemDetails」''，並可能使用'$ scope.selectedItemDetails = {選擇：$ scope.itemList.filter（function（item）{return item.tagNum === tagNumTobeSelectedByDefault;}）[0]};'這是Angular最佳實踐說你的ng模型應該是這樣的原因之一總是包含一個'.'（點） –

在angularjs應用程序中默認選擇單選按鈕

回答

相關問題