mdSidenav服务在Angular组件内部找不到组件

时间:2015-12-23 10:21:14

标签: javascript angularjs html5 angularjs-1.5

我试图找出为什么无法从自己组件的控制器中找到具有.component()指令的Angular <md-sidenav>。 Angular会抛出以下错误:

  

找不到句柄菜单的实例

整个组成部分是:

function controller($mdSidenav) {
    $mdSidenav("menu").open();
}
controller.$inject = ["$mdSidenav"];

components.component("sideAppMenu", {
    controller: controller,
    controllerAs: "model",
    templateUrl: "path/to/template"
});

......其模板是:

<md-sidenav class="md-sidenav-left md-whiteframe-z2" md-component-id="menu">
    hello world
</md-sidenav>

如果我将整个<md-sidenav>移动到我的index.html(即任何指令/组件之外),$mdSidenav可以找到整个Angular Material组件。

这里出了什么问题?我错过了一些细节吗?

我可以确认整个组件已呈现。也就是说,模板已定位并成功注入

更新

我可以找出问题所在:它是关于组件生命周期的。如果我使用$timeout尝试访问控制器代码一段时间后访问所谓的Angular Material组件,$mdSidenav 可以找到组件

function controller($mdSidenav, $timeout) {
    $timeout(function() {
        // OK!!!!!!!!
        $mdSidenav("menu").open();
        debugger;
    },3000);
}
controller.$inject = ["$mdSidenav", "$timeout"];

如果问题是何时访问组件,如果是在初始化控制器的时候,我何时应该尝试访问Angular Material组件?

1 个答案:

答案 0 :(得分:1)

我可以使用<md-sidenav> click指令/组件属性解决我的问题。

由于我只想锁定为整个应用程序的生命周期打开的菜单,这对我来说没问题。

我怀疑Angular Material开发人员没有涵盖我的用例,但是一旦视图已经加载并且您执行{{1}}或任何事件......就需要服务的情况......

顺便说一句,我会让这个Q&amp; A保持开放的新答案,这样我们就能理解为什么我的情景不起作用......