Question

我是Angular和Ionic的新手以及一般的编程。我正在尝试开发一个小型手机应用程序，我遇到了两个问题。以下是我的代码的代码：http://codepen.io/anon/pen/stobI

<html ng-app="ionicApp">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">

    <title>Tabs Example</title>

    <link href="http://code.ionicframework.com/1.0.0-beta.11/css/ionic.css" rel="stylesheet">
    <script src="http://code.ionicframework.com/1.0.0-beta.11/js/ionic.bundle.js"></script>
  </head>

添加标签上的搜索餐厅按钮仅在您点击按钮底部时才会生效，我不知道为什么会发生这种情况。
点击搜索餐厅按钮后，restaurantquery变量在searchRest函数中显示为未定义。

如果有人可以给我一些关于如何解决这些问题的技巧

Answer 1

我创建了这个问题的编写工具，您可以在此处找到它：http://codepen.io/anon/pen/gBobu。以下是我发现的每个问题的解决方案。

搜索餐馆的按钮似乎完全无法点击，因为它上面的div是离子框架中的项目列表。应用＆＃39;项目＆＃39;类按到它正确显示的按钮并再次单击。
出现这个问题似乎是因为$ ionicModal与控制器的范围隔离，当值更新时，它没有在控制器的$ scope上更新。在控制器中，我将restaurantQuery修改为如下所示。

myapp.controller('mainCtrl', function($scope, $ionicModal, $http, $scope) { $scope.restaurantQuery = { name: "" }; $scope.searchRest = function() { console.log($scope.restaurantQuery.name); } });

然后在HTML标记中，我更改了绑定到此新修改属性的输入的属性。

<input ng-model="restaurantQuery.name" type="text" placeholder="Search">

看起来范围内的对象比字符串值更容易共享。但是，我并不完全确定为什么会出现这种情况。

我希望这有助于解决问题。

Answer 2

请结束标记＆＃34; / ion-content＆＃34;，之前它就像是＆＃34; ion-content＆＃34;关闭后它将正常工作。

 <script id="add.html" type="text/ng-template">
  <ion-view title="Add A Review">
    <ion-content class="padding">
      <div class="list list-inset">
        <label class="item item-input">
          <textarea type="text" placeholder="Review"></textarea>
        </label>
      </div>
      <button class="button button-positive item" ng-click="findRest()">
        Search for a Restaurant
      </div>
   </ion-content> 
  </ion-view>

</script>

Ionic / AngularJS按钮仅从底部单击并且模型未显示

2 个答案: