angular編輯的初始化變數失敗你知道原因嗎？這裡有angularjs初始化失敗的詳解

本篇文章主要的介紹了關於angularjs編輯的初始化變數失敗的原因解釋。希望對大家有幫助，下面就讓我們一起來看這篇文章吧

編輯的初始化，根據點擊編輯項目獲取的id，從後台獲取這個id的所有訊息，然後將對應的欄位初始化給前台的頁面。

大部分的時候我們都不需要做什麼特殊處理，因為當我們獲取到了對象，透過angularjs的雙向綁定就會直接為我們做好初始化的工作。但為什麼這次我單拿出來記錄呢？必然是有不同的地方。

這次編輯出現問題的點主要是在前台設計的時候，其中有個字段是精確度單位，但是在選擇單位的時候，要先選擇單位的類別，而實體中又沒有類別這個字段，所有就自己添加個字段，以便達到下面的效果:

#先選中前面的類別下拉框，然後再點選想要的單位。

問題產生原因

先看下我們對類別的處理

使用底線_的意思就是這個變數是我們自己定義的。這就意味著，我們上面說的第一步，根據id取得過來的物件並沒有這個屬相，要是讓前台顯示出這個類別，就需要我們自己定義一個，並賦值。這也就是標題上所說的變數。

過程

1.最開始定義的時候，就是在直接賦值的：

$scope.data._accuracyMeasurementUnitCategory = $scope.data.primaryParameterCategory.accuracyUnitSet[0].measurementUnitCategory;

但是這種賦值方式並不行，介面上並沒有顯示出來。

2.聯想到前一陣遇過一個類似的問題，問題的原因就是在angular在進行第一次渲染的時候，$scope.data還沒值，所以沒有附上值。所以就將初始化放在回呼函數中去執行：

#發現還是沒有成功。

3.然後對其進行監聽，發現並不是沒有賦值，而是賦值之後又被預設選項請選擇給覆蓋掉了，所以就一直顯示出這個樣子：

看到這裡就好辦了，只要監聽一下變量，當他發生改變，並且改變後的newValue是請選擇，那麼我就對其進行初始化賦值。

$scope.$watch('data._accuracyMeasurementUnitCategory', function(newValue) {
    if (newValue && newValue.name === '请选择') {
        $scope.data._accuracyMeasurementUnitCategory = $scope.data.primaryParameterCategory.accuracyUnitSet[0].measurementUnitCategory;
    }
});

這次成功綁定，但是好像實現的並不好：

#打開控制台，可以看到出現瞭如上的錯誤：$digest達到最大迭代次數。

透過一番查找，最後找到了出現這個Error的原因。

因為指令中已經對類別進行了初始化處理，將其設為請選擇，然後我們在控制器中對他進行監聽，當我們他產生變化並且值為請選擇的時候，給他一個新的值。
而我們知道，angular會進行多次渲染，在指令每次渲染的時候，都設定成一次請選擇，而控制器監聽到又會改變，這就產生了循環。
這時候$digest就會遍歷循環，巡查$watch是否有改變。然後防止無限循環下去，$digest設定了一個最大上限，所以就出現上面截圖的報錯。

4.看著這一大片的紅，讓我感覺很不好。考慮到我現在只是想實現簡單的賦值，那使用比較簡單的方法好像也不錯。所以就考慮使用$timeout來幫助實現功能，他會等一段時間後，告訴$digest去進行渲染。這時，我們想要的價值就有了。

// 初始化主参量的单位
$timeout(function() {
    $scope.data._accuracyMeasurementUnitCategory = $scope.data.primaryParameterCategory.accuracyUnitSet[0].measurementUnitCategory;
}, 100);

到此，問題解決。

總結

當我們嘗試使用更高級的方法去實現我們功能的時候，很可能會碰壁，這時候只能說明自己沉澱的還不夠，那麼換一種簡單的方法不失為一種更好的選擇。想看更多關於angularjs方面的知識，就到PHP中文網angularjs參考手冊欄位中學習

【小編推薦】

angularjs的表達式怎麼用？ angularjs的表達式的使用實例

angularjs過濾器你會使用嗎？我們來看angularjs過濾器的詳細解釋

#

以上是angular編輯的初始化變數失敗你知道原因嗎？這裡有angularjs初始化失敗的詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！