使用 ngClick 动态设置 templateUrl答案

【问题标题】：Set templateUrl dynamically Using ngClick使用 ngClick 动态设置 templateUrl
【发布时间】：2023-03-17 22:40:01
【问题描述】：

我有从我的 Scope 中的数组获取模态 templateUrl 的 url 的函数。然后我在我的 li 上使用此功能将 url 添加到我的模态。但是当我点击 li 时，会执行 showReleventMdl() 函数并在 console.log() 中显示 url 字符串，但我的模式消失了，我发现这个错误：

未捕获的类型错误：无法读取未定义的属性“焦点”

这是我的代码：

app.controller('filterCtrl', function($scope,$modal, $rootScope ,loginService ) {

    var filterTemps = [
        "partial/uiComponent/mdlFilters/mdl.estateType.filter.html",
        'partial/uiComponent/mdlFilters/mdl.dealKind.filter.html',
        'partial/uiComponent/mdlFilters/mdl.buyPrice.filter.html',
        'partial/uiComponent/mdlFilters/mdl.trustPrice.filter.html',
        'partial/uiComponent/mdlFilters/mdl.rentPrice.filter.html',
        'partial/uiComponent/mdlFilters/mdl.forigenPrice.filter.html',
        'partial/uiComponent/mdlFilters/mdl.totalRoom.filter.html',
        'partial/uiComponent/mdlFilters/mdl.substructure.filter.html'
    ];

    var filtersModal = $modal({
        backdrop:true,
        placement:'top',
        controller : 'filterCtrl',
        templateUrl:'',
        show: false
    });

    $scope.showReleventMdl = function(num) {
        filtersModal.templateUrl = filterTemps[num];
        console.log(filtersModal.templateUrl);
        filtersModal.$promise.then(filtersModal.show);
    };


});

 <div class="collapse navbar-collapse" ng-class="!navCollapsed && 'in'" ng-click="navCollapsed = true">
                <!-- your normal collapsable content here -->
                <ul class="nav navbar-nav">
                    <li><a href="" ng-click="showReleventMdl(0)" ng-bind="string.pages.form.estateType"></a><span>: a<span></li>
                    <li><a href="" ng-click="showReleventMdl(1)" ng-bind="string.pages.form.dealKind"><span>: b </span></a></li>
                    <li><a href="" ng-click="showReleventMdl(2)" ng-bind="string.pages.form.buyPrice"><span>: c </span></a></li>
                    <li><a href="" ng-click="showReleventMdl(3)" ng-bind="string.pages.form.trustPrice"><span>: d </span></a></li>
                    <li><a href="" ng-click="showReleventMdl(4)" ng-bind="string.pages.form.rentPrice"><span>: g </span></a></li>
                    <li><a href="" ng-click="showReleventMdl(5)" ng-bind="string.pages.form.forigenPrice"><span>: e </span></a></li>
                    <li><a href="" ng-click="showReleventMdl(6)" ng-bind="string.pages.form.totalRoom"><span>: f </span></a></li>
                    <li><a href="" ng-click="showReleventMdl(7)" ng-bind="string.pages.form.substructure"><span>: g </span></a></li>
                </ul>
            </div>

【问题讨论】：

标签： javascript angularjs angular-strap

【解决方案1】：

我只是将 Modal 放在我的 showReleventMdl() 函数中，一切看起来都很好。

但我还是不知道为什么？

【讨论】：