使用ngClick动态设置templateUrl

Set templateUrl dynamically Using ngClick

本文关键字：templateUrl 设置 动态 ngClick 使用      更新时间：2023-09-26

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

Uncaught TypeError: Cannot read property 'focus' of undefined

这里是我的代码:

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>

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

相关文章：