Question

我想显示包含displayCategory.name的元素，其上面有ng-click，但是它没有按预期工作。

.divider-row
      .row-border(ng-hide="showMe")
        .row.row-format
          .col-xs-12.top-label
            Find where you stand
        %hr.profile
        .row.labelRow
          .col-xs-12
            %ul
              %li(ng-repeat='category in service.categories')
                .clear.btn.Category(ng-click='thisCategory(category) ; showMe = true') {{category.name}}

      .divider-row
      .row-border(ng-show="showMe")
        .row.row-format
          .col-sm-12.col-md-12.top-label.nopadLeft
            What do you think about {{displayCategory.name}}

Answer 1

我将你的haml放入转换器中，这就是吐出来的（明显不正确）：

<div class="divider-row">
  <div class="row-border">(ng-hide="showMe")
    <div class="row row-format">
      <div class="col-xs-12 top-label">
        Find where you stand
      </div>
    </div>
    <hr class="profile"/>
    <div class="row labelRow">
      <div class="col-xs-12">
        <ul>
          <li>(ng-repeat='category in service.categories')
            <div class="clear btn Category">(ng-click='thisCategory(category) ; showMe = true') {{category.name}}</div>
          </li>
        </ul>
      </div>
    </div>
  </div>
  <div class="divider-row"></div>
  <div class="row-border">(ng-show="showMe")
    <div class="row row-format">
      <div class="col-sm-12 col-md-12 top-label nopadLeft">
        What do you think about {{displayCategory.name}}
      </div>
    </div>
  </div>
</div>

所以经过一些快速的谷歌搜索后，我发现你应该这样写：

.divider-row
  .row-border{"ng-hide" => "showMe"}
    .row.row-format
      .col-xs-12.top-label
        Find where you stand...

因为那会转换成你需要的东西：

<div class="divider-row">
  <div class="row-border" ng-hide="showMe">
    <div class="row row-format">
      <div class="col-xs-12 top-label">
        Find where you stand

使用大括号而不是圆形大括号

Answer 2

我无法运行您的代码进行验证，但我认为问题在于绑定属性showMe应该替换为status.showMe之类的对象。

例如，在$scope.status = { showMe: false};之外定义ng-repeat（可能在您的控制器中）。

请查看工作演示：http://jsfiddle.net/jx854d3y/1/

<强>说明：

ng-repeat为每个项目创建子范围。子范围原型继承自父范围。在您的情况下，原始showMe被分配给子范围。当您使用外部 ng-repeat时，它会尝试从父作用域获取值undefined。这就是为什么它不起作用。

基本规则是：始终使用Object而不是基本类型进行绑定。

有关详细信息，请参阅：https://github.com/angular/angular.js/wiki/Understanding-Scopes

为什么我的ng-hide / show不能用于我的ng-click？

2 个答案: