我有一个angular.js / ionic框架应用程序。这会在列表中加载配方,并允许用户保存他们想要的任何配方。问题是,第一次有人点击保存,没有任何反应,但在第二次以后,配方实际上已保存。这是因为在第一次单击保存时未加载变量,并且仅在第一次单击后加载该变量。如何修复我的代码,以便在我第一次点击保存时保存它?
以下是我的html的样子:
<ion-content has-header="true" padding="true" overflow-scroll="true">
<input type="text" ng-model="searchString" placeholder="Search using recipe title ..." />
<ion-list can-swipe="true">
<ion-item class="item item-thumbnail-left" ng-repeat="recipeItem in remoteRecipeList| searchFor:searchString" type="item-text-wrap"
href="#/tab/browse/{{recipeItem.id}}">
<img ng-src="{{recipeItem.get('picture').url()}}">
<div><strong>{{recipeItem.get('title')}}</strong></div>
<div class="">{{recipeItem.get('description')}}</div>
<ion-option-button class="button-balanced" ng-click="doSaveRow(recipeItem.id)">
Save
</ion-option-button>
</ion-item>
</ion-list>
</ion-content>
以下是我的控制器(javascript)的样子:
.controller('BrowseCtrl', function (user, $state, $scope, RecipeService, $cordovaCamera, $ionicPopup, $timeout, ParseRecipeService, ParseConfiguration, UserService, $cordovaSQLite) {
$scope.count = 0;
// if not using parse then assign the image service to the default
// service
if (ParseConfiguration.USING_PARSE === false) {
ParseRecipeService = RecipeService;
console.log("ParseConfiguration: " + ParseConfiguration.USING_PARSE);
}
ParseRecipeService.all().then(function (_data) {
$timeout($scope.remoteRecipeList = _data, 0);
console.log(JSON.stringify(_data));
}, function (_error) {
console.error(JSON.stringify(_error));
alert(_error.message)
});
// Save the selected recipe to SQL database
$scope.doSaveRow = function (_index) {
$scope.count++;
ParseRecipeService.get(_index).then(function (_data) {
$timeout($scope.recipeItem = _data, 0);
}, function (_error) {
console.error(_error.message);
});
var query = "INSERT INTO recipetable (id, instructions, title, description, num_serves, recipe_type, time_in_minutes, picture, ingredients) VALUES (?,?,?,?,?,?,?,?,?)";
$cordovaSQLite.execute(db, query, [null, $scope.recipeItem.get('instructions'), $scope.recipeItem.get('title'), $scope.recipeItem.get('description'), $scope.recipeItem.get('num_serves'), $scope.recipeItem.get('recipe_type'), $scope.recipeItem.get('time_in_minutes'), $scope.recipeItem.get('picture').url(), $scope.recipeItem.get('ingredients')]).then(function(res) {
alert("The recipe has been saved to your device");
}, function (err) {
console.error(err);
});
$scope.searchTitles = true;
$scope.searchDescriptions = true;
$scope.$watch('searchTitles', function(){
$scope.searchKeys = [ $scope.searchTitles ? 'title' : null, $scope.searchDescriptions ? 'description' : null ];
});
$scope.$watch('searchTitles', function(){
$scope.searchKeys = [ $scope.searchTitles ? 'title' : null, $scope.searchDescriptions ? 'description' : null ];
});
};
})