在ng-视图控制器中调用函数。

I have a directive as given below,

我有如下指示，

app.directive('metadataSelectPicker', ['ManagementService', '$timeout', '$location', function (ManagementService, $timeout, $location) {
return {
    restrict: 'E',
    replace: true,
    templateUrl: 'Views/NgTemplates/DirectiveTemplates/MetaDataSelectPicker.html',
    link: function (scope, elem, attr) {
        var promise = ManagementService.getMetaDataList();
        promise.then(function (response) {
            if (response.data.length > 0) {
                scope.metaDataList = response.data;
                $timeout(function () {
                  $('.selectpicker').on('change', function () {
                        $('.selectpicker').selectpicker('refresh');
                        $timeout(function () {
                            if (scope.selectedMetaData == 'Class') {
                                $location.path('/class');
                            } else {
                                $location.path('/metadata');
                            }
                        });
                    });
                });
            }
        }, function () {
            alert('Data fetching failed.');
        });
    }
}
}]);

The MetaDataSelectPicker.html is given below:

MetaDataSelectPicker。html是下面的:

<div id="metaDataSelectPicker">
<div class="sel_allcustom_name">
    <select class="selectpicker show-tick form-control" ng-model="selectedMetaData">
        <option ng-repeat="metaData in metaDataList" value="{{metaData.ValueText}}">{{metaData.DisplayText}}</option>
    </select>
</div>
<div class="clearfix"></div>

I'm using this directive is in a page with controller named homeController. In this page I used ng-view tag to load different contents. The following code is used to redirect various pages in to ng-view tag.

我使用这个指令在一个名为homeController的控制器的页面中。在这个页面中，我使用了ng-view标签来加载不同的内容。下面的代码用于将不同的页面重定向到ng-view标记。

if (scope.selectedMetaData == 'Class') {
                                $location.path('/class');
                            } else {
                                $location.path('/metadata');
                            }

In the routeProvider configuration, I have specified different controller for each ng-view path. Initally, I'm not loading any view to the ng-view. But I'm redirecting the ng-view page while changing the options in the select control. In the controller of /metadata page, I have a function and assigned to a scope variable. I need to call that function while changing the select option and if scope.selectedMetaData != 'Class'. I need to do it as follows,

在routeProvider配置中，我为每个ng-view路径指定了不同的控制器。暂时，我没有将任何视图加载到ng视图中。但是我正在重定向ng-view页面，同时更改select控件中的选项。在/metadata页面的控制器中，我有一个函数并分配给一个范围变量。我需要在更改select选项和if范围时调用该函数。selectedMetaData ! =“类”。我需要这样做，

if (scope.selectedMetaData == 'Class') {
                                $location.path('/class');
                            } else {
                                $location.path('/metadata');
                                scope.doSomething();
                            }

But while changing the option, the corresponding controller may not be loaded. So the scope.doSomething(); will not work. I don't like to use broadcast event. I need to tract the ng-view page load and perform the function after that. How can I do that? Or suggest me any other better method. Please help me.

但是在更改选项时，可能不会加载相应的控制器。所以scope.doSomething();将不会工作。我不喜欢使用广播事件。我需要收缩ng-view页面加载，然后执行函数。我怎么做呢?或者给我其他更好的方法。请帮助我。

1 个解决方案

#1

You can use https://github.com/angular-ui/ui-router for routing and then you can use one of state change events ref. https://github.com/angular-ui/ui-router/wiki

您可以使用https://github.com/angular-ui/ui路由器进行路由，然后您可以使用一个状态更改事件ref. https://github.com/angular-ui/ui-router/wiki