OnsenUI 无法访问代码中的组件

Question

我正在开发 OnsenUI Cordova 应用程序，使用 OnsenUI 1.3.1（通过 bower 安装）、AngularJS 1.3.15 和 Cordova 5.0.0。我无法访问 JavaScript 中的 ons-navigator 对象，OnsenUI 网站 (http://onsen.io/guide/overview.html#CallingComponentAPIsfromJavaScript) 中提到的所有这样做的方法似乎都不适合我。我的代码设置如下：

index.html:

...
  <body>
    <div ng-controller="MainController">
      <ons-navigator id="navigator" var="myNavigator" page="{{targetPage}}">
        <div>
            Hello!
        </div>
      </ons-navigator>
    </div>
    ...
  </body>
...

主控制器：

angular.module('myApp.controllers')
  .controller('MainController', ['$log', '$scope',
    function ($log, $scope) {
      $scope.initialize = function () {
        $scope.targetPage = 'views/login.html';

        $log.info('scope navigator: ' + $scope.myNavigator);    // comes back as undefined
        $log.info('find navigator: ' + ons.findComponent('ons-navigator#navigator', document.body));    // comes back as null
      };

      $scope.initialize();

    }]);

我目前没有输出 OnsenUI 文档中概述的使用 ons.findParentComponentUntil() 方法或涉及更改基于组件的对象的方法，但我已经研究过这些方法，但他们没有似乎也可以工作（返回未定义）。

有人有什么想法吗？谢谢！

Answer 1

您正试图在导航器元素创建之前访问它，请尝试使用 ons.ready(); 执行您的代码，例如：

 ons.ready(function() {
      
      console.log("scope navigator: " + $scope.myNavigator);
});

OnsenUI 无法访问代码中的组件

OnsenUI can't access component in code

angularjs

onsen-ui