Javascript AngularJS：根据第一个选择下拉列表的选择填充第二个选择下拉列表

我试图根据angularJS中第一个选择下拉列表的选择填充第二个选择下拉列表。我不知道为什么它不更新DOM（UI）：

下拉列表1

<div class="input-field col s12 m4 l4 xl4">
        <select ng-model="selectedMacroProdotti.fdlcatprod.l01CatPrd" name="l02CatPrd" class="validate" required 
            ng-options="item.l01CatPrd as (item.l01CatPrd | uppercase) for item in listCategoriaProdotti"
            ng-change="populateTipoProdottoListino()">
            <!--  -->
        </select> <label>Codice Categoria Prodotto*</label>
        <div role="alert">
                <span class="error" ng-show="ModificaMacroProdotto.l02CatPrd.$error.required"><font color="red">Campo Obbligatorio!</font></span>           
        </div>
    </div>

列表listTipoProdottoListinoFiltered中填充了值，但前端没有任何操作。 我还使用了$scope.$apply（），但它不能解决我的问题

你能帮我吗

---

谢谢。

我为你的问题制作了一把小提琴，它很好用 尝试在您的代码，如果它不工作，请更新您的代码在小提琴，我们可以一起调试

[http://jsfiddle.net/swatrahul/Xku9z/504/][1]

我解决了这个问题。 问题是角度物化（）：

如果要更新select中的项目，只需在编辑原始select后从上面重新运行初始化代码。或者，您可以使用下面的功能销毁材质选择，并创建一个新的选择

$（'select'）。材料_select（'destroy'）

我的更新代码如下：

$scope.populateTipoProdottoListino = function(){
        $scope.listTipoProdottoListinoFiltered = [];
        var currentCatProd = $scope.selectedMacroProdotti.fdlcatprod.l01CatPrd;
        $scope.listTipoProdottoListino.forEach(function(item,index){
            if(item.l39CatPrd === currentCatProd){
                $scope.listTipoProdottoListinoFiltered.push(item);
            }
        });
        setTimeout(() => {
            $('#l02TipPrdLst').material_select('destroy');
            $('#l02TipPrdLst').material_select();
            $scope.$apply();
        }, 10);

    }

[http://jsfiddle.net/swatrahul/Xku9z/504/][1]

$scope.populateTipoProdottoListino = function(){
        $scope.listTipoProdottoListinoFiltered = [];
        var currentCatProd = $scope.selectedMacroProdotti.fdlcatprod.l01CatPrd;
        $scope.listTipoProdottoListino.forEach(function(item,index){
            if(item.l39CatPrd === currentCatProd){
                $scope.listTipoProdottoListinoFiltered.push(item);
            }
        });
        setTimeout(() => {
            $('#l02TipPrdLst').material_select('destroy');
            $('#l02TipPrdLst').material_select();
            $scope.$apply();
        }, 10);

    }