我正在使用基於移動的web應用程序,我使用angular js
和onsen ui
,我在用戶配置文件中創建了一個按鈕,用戶可以在其中跟隨另一個按鈕剛開始的時候用戶的配置文件加載,一個角控制器ProfileInfoCtrl
設置所有用戶的相關信息,以他的個人資料頁,而其套在那裏我做了另一個控制器FollowBtnCtrl
爲後續按鈕,並設置ng-click="followMe({{ oUserInfo.id }})"
與我得到了在後續按鈕錯誤信息按鈕。獲取語法錯誤ng-click在angularjs中的按鈕
所有的值都設置正確,但在按鈕ng-click="followMe({{ oUserInfo.id }})"
內部,它給了我瀏覽器控制檯中的以下錯誤。
錯誤:
Error: [$parse:syntax] http://errors.angularjs.org/1.4.3/$parse/syntax?p0=%7B&p1=invalid%20key&p2=11&p3=followMe(%7B%7B"<button ng-click="followMe({{ oUserInfo.id }})" class="followButton button button-bar__button {{ oUserInfo.follow_class }}" style="line-height:20px; width:72px; padding:0 5px; margin-left:-15px;">"UserInfo.id%20%7D%7D)&p4=%7B%oUserInfo.id%20%7D%7D)
at Error (native)
at http://localhost:8080/ItApp_1/onsen/js/angular/angular.min.js:6:416
at Object.q.throwError (http://localhost:8080/ItApp_1/onsen/js/angular/angular.min.js:209:32)
at Object.q.object (http://localhost:8080/ItApp_1/onsen/js/angular/angular.min.js:208:327)
at Object.q.primary (http://localhost:8080/ItApp_1/onsen/js/angular/angular.min.js:205:335)
at Object.q.unary (http://localhost:8080/ItApp_1/onsen/js/angular/angular.min.js:205:174)
at Object.q.multiplicative (http://localhost:8080/ItApp_1/onsen/js/angular/angular.min.js:204:434)
at Object.q.additive (http://localhost:8080/ItApp_1/onsen/js/angular/angular.min.js:204:261)
at Object.q.relational (http://localhost:8080/ItApp_1/onsen/js/angular/angular.min.js:204:96)
at Object.q.equality (http://localhost:8080/ItApp_1/onsen/js/angular/angular.min.js:203:425)
當我已經拋出的角度誤差的鏈接後,頁面給予的我下面的錯誤定義
Syntax Error: Token '{' invalid key at column 11 of the expression [followMe({{""UserInfo.id }})] starting at [{4}].
我不理解我的錯,因爲我檢查了很多時間的所有語法,但沒有發現任何錯誤。請幫我&電話我哪裏做錯了,波紋管是HTML和角度控制器,
HTML: -
<ons-page ng-controller="ProfileInfoCtrl" class="profile-page">
<ons-toolbar fixed-style>
<div class="left">
<ons-toolbar-button ui-sref="sliding.main">
<ons-icon icon="ion-ios-home" style="vertical-align:-4px;"></ons-icon>
</ons-toolbar-button>
</div>
<div class="center navigation-bar__title">
{{ oUserInfo.first_name }} {{ oUserInfo.last_name }}
</div>
<div class="right" ng-controller="FollowBtnCtrl">
<ons-toolbar-button>
<button ng-click="followMe({{ oUserInfo.id }})" class="followButton button button-bar__button {{ oUserInfo.follow_class }}"
style="line-height:20px; width:72px; padding:0 5px; margin-left:-15px;">
{{ oUserInfo.follow_text }}
</button>
</ons-toolbar-button>
</div>
</ons-toolbar>
<div class="profile-card">
<img class="profile-image" src="{{ oUserInfo.profile_pic }}" alt="{{ oUserInfo.first_name }} {{ oUserInfo.last_name }}">
<div class="profile-name">{{ oUserInfo.first_name }} {{ oUserInfo.last_name }}</div>
<div class="profile-id">{{ oUserInfo.email }}</div>
<div class="profile-desc">{{ oUserInfo.gender }} , Age - {{ oUserInfo.age }} Years</div>
</div>
角位指示ProfileInfoCtrl: -
app.controller("ProfileInfoCtrl",
[ '$scope', '$http', '$stateParams',
function($scope, $http, $stateParams){
$scope.oUserInfo = null;
if(!isNaN($stateParams.uid) && !isNaN($stateParams.id)){
var parameter = JSON.stringify({type:"user_info", user_id: $stateParams.id, ouser_id: $stateParams.uid});
$http({
url: 'AjaxController',
dataType: 'json',
method: 'POST',
data: parameter,
headers: {
"Content-Type": "application/json"
}
}).success(function(data, status, header, config){
$scope.oUserInfo = data;
}).error(function(data, status, header, config){
});
}
}]);
角度控制器FollowBtnCtrl: -
app.controller("FollowBtnCtrl",
[ '$scope', '$http', '$stateParams',
function($scope, $http, $stateParams){
// Make an AJAX call, retrieving the state.
$scope.followMe = function($fId){
var $button = angular.element(jQuery.find(".followButton"));
var $requestType = "";
$button.attr('disabled','disabled');
if($button.hasClass('following')){
$requestType = "unfollow";
var request = {
method: 'POST',
url: 'follower.ajax?requestType=' + $requestType + '&fId=' + $fId
}
$http(request).
then(function(response){
if(response.data.type == "success"){
$scope.userinfo.following_count = $scope.userinfo.following_count - 1;
$button.addClass('btn-primary');
$button.removeClass('btn-success');
$button.removeClass('following');
$button.text('Follow');
}
else{
// alert('Error !!');
}
$button.removeAttr('disabled');
},
function(response){
// alert('Error !!');
$button.removeAttr('disabled');
});
}
else {
$requestType = "follow";
var request = {
method: 'POST',
url: 'follower.ajax?requestType=' + $requestType + '&fId=' + $fId
}
$http(request).
then(function(response){
if(response.data.type == "success"){
$scope.userinfo.following_count = $scope.userinfo.following_count + 1;
$button.removeClass('btn-primary');
$button.addClass('btn-success');
$button.addClass('following');
$button.text('Following');
}
else{
// alert('Error !!');
}
$button.removeAttr('disabled');
},
function(response){
// alert('Error !!');
$button.removeAttr('disabled');
});
}
}
$scope.sprocketInfo =
$http.get("/api/sprocket/" + $stateParams.id)
.then(function(res){ return res.data; });
}]);
我已經刪除它,但它沒有得到oUserInfo.id的值,並向我展示'ng-click =「followMe(oUserInfo.id)」'在輸出html –
我想在o內部打印oUserInfo.id followMe功能,那麼我需要做什麼。它有任何解決方案嗎?因爲在另一頁顯示多個用戶的列表中的與後續的按鈕 –
有你在控制檯有一個新的錯誤呢? – ianaya89