Question

点击事件后我无法访问angularjs表达式。

的index.html

<div class="row">
    <a href="#/company"><div class="tile col col-comp cat-a-g grow-appear" ng-click="onSelect(item)" ng-repeat="item in data" >
        <p>{{item.compname}}</p>
    </div></a>
</div>

上面的代码填充了公司名称列表。当我点击公司时，它会打开company.html

company.html

<div class="comp-info col s12 grow-appear">
   <span class="comp-logo-container">
      <img src="images/aap3-160x70-black.jpg" />
   </span>
   <span class="comp-info-container">
      <p><i class="far fa-envelope"></i>{{item.compemail}}</p>
      <p><i class="fas fa-location-arrow"></i>{{item.compbuilding}}</p>
      <p><i class="fas fa-phone"></i>{{item.compphone}}</p>
   </span>
</div>

控制器（app.js）

$scope.onSelect = function($event, data) {
   console.log(data);
}

文件结构

root
    +--public
        +--templates
            +--company.html
            +--index.html
        +--javascript
            +--app.js
    +--views
        +main.html

我正在使用ngRoute将index.html和company.html注入main.html。

app.config(function($routeProvider){
    $routeProvider

    .when ('/', {
         templateUrl: 'templates/home.html',
         controller: 'AppCtrl'
    })

    .when ('/company', {
         templateUrl: 'templates/company.html',
         controller: 'AppCtrl'
    })
});

所以当我在console.log（）控制器时，它会显示数据数组，但不会将其添加到公司的html文档中。我错过了什么？

Answer 1

您的应用程序的结构有点不清楚，但我认为您的问题可能与$ scope有关。无法从$ scope的根目录访问item中的item in data。你可以这样做：

<div class="comp-info col s12 grow-appear">
   <span class="comp-logo-container">
       <img src="images/aap3-160x70-black.jpg" />
   </span>
   <span class="comp-info-container">
       <p><i class="far fa-envelope"></i>{{selected.compemail}}</p>
       <p><i class="fas fa-location-arrow"></i>{{selected.compbuilding}}
       </p>
       <p><i class="fas fa-phone"></i>{{selected.compphone}}</p>
   </span>
</div>

然后：

$scope.onSelect = function($event, data) {
  $scope.selected = data;
}

使用ng-click访问AngularJS表达式

1 个答案: