Question

所以我正在学习在JONIC应用程序上使用的angularJS，而且我被卡住...我有一个textarea允许我过滤我从API检索的.json，之后，我显示所有的元素在离子列表中，我希望每个元素都是一个新的离子视图，它显示有id信息，以及来自其ID的每个信息。

配置：

app.config(function($stateProvider, $urlRouterProvider) {
  $stateProvider
    .state('home', {
    url: '/',
    templateUrl: 'home.html',
    controller: 'MyCtrl'
  })
    .state('home.tab', {
    url: '/{dataId}',
    templateUrl: "tab.html",
    controller: 'dataCtrl',
    resolve: {
      data: function($stateParams, dataCtrl) {
        return dataCtrl.getData($stateParams.dataId)
      }
    }
  })
    $urlRouterProvider.otherwise('/');
})

控制器：

app.controller('dataCtrl', function($scope, data) { 
    $scope.showMap = function(dataID) {
        $http.get("https://api.cofaq.fr/v1/magasins/"+dataId+".json").success(function(data, status, headers, config) {    
                    $scope.data = data;
               }); 
    }
})

HTML：

<script id="home.html" type="text/ng-template">
      <ion-view title="Home" hide-back-button="true">

          <ion-content class="padding">
          <div class="item item-divider" > 
          ion-textArea
          </div>
          <div class="item item-input-inset">
            <label class="item-input-wrapper">
                <i class="icon ion-search placeholder-icon"></i>
              <input ng-model="search" type="text" placeholder="Recherche">
            </label>
            <button class="button button-small" ng-click="look(search)">
              Submit
            </button>
          </div>

          <ion-list>             
            <ion-item ng-repeat="data in json" ui-sref="home.tab({dataId : data.id})"> <!-- ng-click="showMap()" ng-init= -->
              <span ng-bind="data.name"></span>  
                <i class="icon icon-right ion-chevron-right"></i>
            </ion-item>
          </ion-list>         
           <!---------------------------------------------------------------------------------------->
                 </ion-content>
          </ion-view>
    </script>  

    <script id="tab.html" type="text/ng-template">
        <ion-view title="{{data.name}}">
            <ion-content class="padding">
              TEST
            </ion-content>
        </ion-view>
    </script>

请求帮助。

编辑1：我做了一些修改，因为synthax不太正确配置：

    .state('tab', {
    url: '/:dataId',
    templateUrl: "tab.html",
    controller: 'dataCtrl',
    resolve: {
      data : function($http,$stateParams) {
        $http.get("https://api.cofaq.fr/v1/magasins/"+$stateParams.dataId+".json").success(function(data) {  
                    return data;
               }); 
            }
      }
  })

模块化视图错误

0 个答案: