Question

我在指令中使用md-sidenav。我希望这是一个可重复使用的组件，可能在任何一方都有一个。我在指令中有一个关闭并打开的按钮：

$mdSidenav($scope.header).close()
$mdSidenav($scope.header).open()

如果我然后在sidenav中硬编码md-component-id名称，那么它匹配$ scope.header：

<md-sidenav class="md-sidenav-left md-whiteframe-z2" md-component-id="Tasks">

然后上面的工作，但我希望它是灵活的：

<md-sidenav class="md-sidenav-left md-whiteframe-z2" md-component-id="{{header}}">

这不起作用。也许这是一个角度材料的功能要求支持这个？这个问题有没有简单的解决方法？

Answer 1

这似乎工作正常。 Example（使用Angular 1.4，角度材料0.8.3）

HTML：

<body ng-controller="AppController" ng-init="init()">
<md-sidenav class="md-sidenav-left md-whiteframe-z2" md-component-id="{{header}}">
  <h2>
    <span>Value of $scope.header: </span>
    <span ng-bind="header"></span>
  </h2>
  <h2>
    <span>Value of md-component-id on sidenav: </span>
    <span ng-bind="md_component_id"></span>
  </h2>
</md-sidenav>

控制器：

angular.module 'App'
  .controller 'AppController', ($scope, $timeout) ->
    $scope.header = 'test'

    $scope.init = ->
      $timeout ->
        $scope.md_component_id = angular.element('md-sidenav').attr('md-component-id')
      , 500

是否可以在md-sidenav中使用md-component-id中的绑定？

1 个答案: