javascript - 如何访问 ion-header-bar 中保存为指令的当前 View 的 Controller ？

Question

当我将 ion-header-bar 放入单独的文件 ( header-dash.html ) 并将其分配为指令“headerDash ”时，我似乎无法访问我的 DashCtrl或我的 View 的 Controller ，其中调用 header-dash 指令。更具体地说，在下面的代码中，我无法调用函数 changeDashMode() 。但是，当我替换<header-dash></header-cash>时有了 header-dash.html 的内容，那么一切正常。

我想这与指令的设置有关，有人认为吗？

更新:newImport()也在 header-dash 中起作用...当我添加另一个函数changeDashMode 时它不起作用。这是怎么回事？

controllers.js

.controller('DashCtrl', function($scope) {

  // -------------------------------------------------------------------------
  // Init
  $scope.dashMode = false;


  // ---------------------------------------------------------------------------
  $scope.changeDashMode = function() {
    console.log("test")
    if (!$scope.dashMode) {$scope.dashMode = true;} else {$scope.dashMode = false;}
  }

// and the rest of the controller 
// ...
})

header-dash.html

<ion-header-bar align-title="center" class="bar-positive">
  <div class="buttons"> 
    <button class="button button-light" ng-click="newImport()">+ New</button>
  </div>
  <h1 class="title"><logo></logo></h1>
  <div class="buttons" ng-controller="DashCtrl">
    <button class="button button-light" ng-show="!dashMode" ng-click="changeDashMode()">Select</button>
    <button class="button button-light" ng-show="dashMode" ng-click="changeDashMode()">Edit</button>
  </div>
</ion-header-bar>

tab-dash.html

<ion-view view-title="Dashboard">

  <header-dash></header-dash>

  <ion-content has-bouncing="true" has-header="true">
    <ion-refresher
    pulling-text="Pull to refresh..."
    on-refresh="doRefresh()">
    </ion-refresher>

    <ion-list>
      <ion-item>Select mode? {{dashMode}}</ion-item>
    </ion-list>


  </ion-content>
</ion-view>

directives.js

angular.module('starter.directives', [])

.directive('headerDash', function() {
  return {
    restrict: 'E',
    templateUrl: 'templates/header-dash.html' // tried to add controller: "DashCtrl" but that didnt work
  }
})

Answer 1

tab-dash.html 是 DashCtrl 显示的模板吗？

因为在 header-dash.html 中，您再次使用 ng-controller，创建一个子作用域，从而有效地将 DashCtrl 包含在 DashCtrl

<div class="buttons" ng-controller="DashCtrl">