Question

我觉得我错过了一些显而易见的东西，有一些输入文字在离子中。我在这条路线上使用angular-ui-router：

 $stateProvider.state('findPersons', {
   url : '/findPersons',
   templateUrl : 'html/findPersons.html',
   controller : 'findPersonsCtrl'
 });

这是findPersons.html中的文字输入代码：

<div class="bar bar-header item-input-inset">
  <label class="item-input-wrapper">
    <i class="icon ion-search placeholder-icon"></i>
    <input type="search" placeholder="Key Word" ng-model="keyWord">
  </label>
  <button ng-click="findPersons()" class="button button-bar-inline">Load</button>
</div>

然后我使用keyword以这种方式请求其他API：

bockmoiApp.controller("findPersonsCtrl", function($scope, $http) {
  $scope.results= null;
  $scope.numberOfResults=-1;
  $scope.keyWord="";

  $scope.findPersons = function() {

    $http({
      method : 'GET',
      url : 'http://localhost:8080/bockmoi/rest/findPersons?keyWord='
          +$scope.keyWord+'&page=0&size=2'
    })
    .then(function successCallback(response) {
      $scope.results = response.data;
      $scope.numberOfResults=$scope.results.numberOfElements;
    },function errorCallback(response) {

    });
  }
});

我想知道为什么当我点击load按钮时，在发送请求之前，keyWord值始终被""替换，从而导致获取所有第一个size结果在远程数据库！毫无疑问，这段代码正在处理原生的html，css和angularjs代码而没有离子。

有人可以告诉我我做错了吗？

Answer 1

您需要使用＆＃34;点符号＆＃34;。由于继承，简单值不会进行双向绑定。

请使用以下代码进行与离子

的双向数据绑定

在控制器中

$scope.test={keyWord : ""};

在视图中

<div class="bar bar-header item-input-inset">
    <label class="item-input-wrapper">
        <i class="icon ion-search placeholder-icon"></i>
        <input type="search" placeholder="Key Word" ng-model="test.keyWord">
    </label>
    <button ng-click="findPersons()" class="button button-bar-inline">Load</button>
</div>

直播示例是here＆amp;同样的问题是here。

从here了解详情。

希望这有帮助！

Answer 2

找到下面的代码一切正常。可能的错误

$ http调用中的URL分为两行。解决它。

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope,$http) {
$scope.name = 'World';
$scope.results= null;
   $scope.numberOfResults=-1;
   $scope.keyWord="";

   $scope.findPersons = function() {
    var URL= "http://localhost:8080/bockmoi/rest/findPersons?keyWord="+$scope.keyWord+'&page=0&size=2';
    console.log(URL);
    $http({
      method : 'GET',
      url : 'http://localhost:8080/bockmoi/rest/findPersons?keyWord='+$scope.keyWord+'&page=0&size=2'
    }).then(function successCallback(response) {
    $scope.results = response.data;
    $scope.numberOfResults=$scope.results.numberOfElements;

    },function errorCallback(response) {

  });
}
});

我尝试在点击按钮后打印您的URL，如上面的代码所示，行为符合预期。

<强> LIVE DEMO

Answer 3

我尝试了你的代码，但我无法重现你的问题。对不起:(。只是一个加号，你是否想要改进你的代码，你可以按照约翰爸爸的建议https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md

AngularJs数据绑定不适用于离子

3 个答案: