Question

我在使用MD按钮内的链接以正常加载页面内容时遇到麻烦，我只是使用

<a class="wordpress" href="#" ng-click="active='Wordpress'">Wordpress</a>

然后它只写我需要的内容

<p ng-show="active === 'Wordpress'">Find a sample of my wordpress codeing</p>

但这不适用于md按钮，即使具有相同的paragragh输出，它也不会写入任何内容

<md-menu-item>
  <md-button>
    <a class="TokusatsuSeries" ng-click="active='TokusatsuSeries'">
      Tokusatsu Series/Five Year War
    </a>
  </md-button>
</md-menu-item>

<p ng-show="active === 'TokusatsuSeries'">You chose <b>{{active}}</b></p>

Edit尝试了VM破坏代码的2条建议，但点击率并没有比我原来的更好：

<md-menu-item>
            <md-button>
                    <a class="TokusatsuSeries" 
                       ng-click="$ctrl.active='TokusatsuSeries'">Tokusatsu Series/Five Year War
                    </a>
            </md-button>
</md-menu-item>

和要写的段落

<p ng-show="$ctrl.active === 'TokusatsuSeries'">You chose <b>{{active}}</b></p>

Answer 1

似乎出现了此问题，因为一种物质成分创建了它自己的scope。您应该避免这种情况。如果您使用的是AngularJS组件，则应绑定到$ctrl，即

<md-menu-item>
    <md-button>
        <a class="TokusatsuSeries" 
           ng-click="$ctrl.active='TokusatsuSeries'">Tokusatsu Series/Five Year War
        </a>
    </md-button>
</md-menu-item>

<p ng-show="$ctrl.active === 'TokusatsuSeries'">You chose <b>{{active}}</b></p>

否则，您可以使用controllerAs语法

<div ng-controller="SomeController as vm">
    <md-menu-item>
        <md-button>
            <a class="TokusatsuSeries" 
               ng-click="vm.active='TokusatsuSeries'">Tokusatsu Series/Five Year War
            </a>
        </md-button>
    </md-menu-item>

    <p ng-show="vm.active === 'TokusatsuSeries'">You chose <b>{{active}}</b></p>
</div>

Ng单击和md按钮冲突

1 个答案: