这不是插值问题。我删除了代码中的所有插值,但仍然遇到相同的错误。
当我单击ng-click时,遇到错误,该错误指向指向在app.js中定义为.state的页面引用。这个错误是什么意思?我无法通过Google搜索找到任何引用,特别是nextEvent
// app.js
.state('tab.clubs', {
cache: false,
url: '/clubs',
views: {
'tab-clubs': {
templateUrl: 'templates/tab-clubs.html',
controller: 'ClubCtrl'
}
}
})
.state('tab.club-detail', {
url: '/clubs/:clubID',
views: {
'tab-clubs': {
templateUrl: 'templates/detail-clubs.html',
controller: 'ClubDetailCtrl'
}
}
})
还有我模板中的呼叫。注意,在另一个ng-repeat中嵌套了一个ng-repeat-但是我不认为这是造成此问题的原因,因为所有内容均正确地呈现了预期的ID和索引....并且仅当我单击嵌套ng-repeat内的<div ng-click="....">
:
<div id="club_tabItem_{{club.data[0].clID}}" style="padding:5px;border-bottom:1px solid grey;" class="item-remove-animate item-avatar" ng-repeat="club in clubs">
<div id="loc_{{club.data[0].clID}}" style="left:15px;">
<div ng-click="showEvents(club.data[0].clID);">
<h3>{{club.data[0].clVendor}}
<!-- <span style="margin-left:15px;">Location: {{club.data[0].clAddress1}}, {{club.data[0].clCity}}</span> -->
<i style="font-size:25px;float:right;" class="icon ion-android-arrow-dropdown-circle icon-accessory customColor1"></i>
</h3>
<span style="padding-left:30px;">{{club.data[0].clDesc}}</span>
</div>
<div id="eventsDiv_{{club.data[0].clID}}" style="width:100%;display:none;margin-top:10px;background-color:lightGrey;">
<div id="events_{{event.ceID}}" style="width:80%;margin-left:20%;display:inline-block;" ng-repeat="event in club.events">
<div ng-click="$location.url('/tab/clubs/' + event.ceID)" >
<div style="float:left;font-size:14px;font-weight:bolder;">{{event.ceName}} ({{event.ceName1}}) </div>
<div style="float:left;margin-left:15px;">Location: {{club.data[0].clAddress1}}, {{club.data[0].clCity}}</div>
<div style="float:left;margin-left:15px;">Next: {{nextEvent(event)}}</div>
<i style="font-size:25px;" class="icon ion-android-arrow-dropright-circle icon-accessory customColor1"></i>
</div>
</div>
</div>
</div>
</div>
在上述情况下,调用为:ng-click="$location.url('/tab/clubs/1')"
-在控制器中,我有$scope.$location = $location
,其中$ location已正确传递到控制器中。
据我所知,调试甚至没有进行到.state detail-clubs页面的控制器。在进入控制器之前会触发错误。
有关错误的更多信息:
ionic.bundle.js:20306 Error: [$parse:ueoe] Unexpected end of expression: nextEvent(club.event[club.eIndex]
http://errors.angularjs.org/1.3.13/$parse/ueoe?p0=nextEvent(club.event%5Bclub.eIndex%5D
at ionic.bundle.js:8762
at Parser.consume (ionic.bundle.js:20747)
at Parser.functionCall (ionic.bundle.js:21022)
at Parser.primary (ionic.bundle.js:20694)
at Parser.unary (ionic.bundle.js:20970)
at Parser.multiplicative (ionic.bundle.js:20953)
at Parser.additive (ionic.bundle.js:20944)
at Parser.relational (ionic.bundle.js:20935)
at Parser.equality (ionic.bundle.js:20926)
at Parser.logicalAND (ionic.bundle.js:20917)
(anonymous) @ ionic.bundle.js:20306
(anonymous) @ ionic.bundle.js:17256
$broadcast @ ionic.bundle.js:23421
(anonymous) @ ionic.bundle.js:40889
processQueue @ ionic.bundle.js:21888
(anonymous) @ ionic.bundle.js:21904
$eval @ ionic.bundle.js:23100
$digest @ ionic.bundle.js:22916
$apply @ ionic.bundle.js:23205
(anonymous) @ ionic.bundle.js:20063
eventHandler @ ionic.bundle.js:11713
triggerMouseEvent @ ionic.bundle.js:2863
tapClick @ ionic.bundle.js:2852
tapTouchEnd @ ionic.bundle.js:2975
答案 0 :(得分:-1)
不要混合AngularJS表达式和插值:
<div id="events_{{event.ceID}}" style="width:80%;margin-left:20%;display:inline-block;" ng-repeat="event in club.events">
̶<̶d̶i̶v̶ ̶n̶g̶-̶c̶l̶i̶c̶k̶=̶"̶$̶l̶o̶c̶a̶t̶i̶o̶n̶.̶u̶r̶l̶(̶'̶/̶t̶a̶b̶/̶c̶l̶u̶b̶s̶/̶{̶{̶e̶v̶e̶n̶t̶.̶c̶e̶I̶D̶}̶}̶'̶)̶"̶>̶
<div ng-click="$location.url('/tab/clubs/'+event.ceID)">
<div style="float:left;font-size:14px;font-weight:bolder;">{{event.ceName}} ({{event.ceName1}}) </div>
<div style="float:left;margin-left:15px;">Location: {{club.data[0].clAddress1}}, {{club.data[0].clCity}}</div>
<div style="float:left;margin-left:15px;">Next: {{nextEvent(event)}}</div>
<i style="font-size:25px;" class="icon ion-android-arrow-dropright-circle icon-accessory customColor1"></i>
</div>
</div>
有关更多信息,请参见Why mixing interpolation and expressions is bad practice。