ng-click函数是调用但是数组数据没有显示在AngularJS的HTML页面中?

时间:2017-08-17 13:55:29

标签: javascript angularjs

ng-click功能在选项卡上正确调用,我正确地从服务中获取列表,但数据没有反映在HTML页面中我不明白我的代码中的问题是什么请检查我的代码并告诉我哪个地方我错了?



/**
 * @Summary:getUserCategory function, to get the User selected Category.
 * @param:   callback
 * @return:  callback(response) .
 * @Description: 
 */
//Defining function for getUserProfile in service 
$scope.getUserCategory = function () {
    var data = {
        userTypeKeyId: Number(AUTH.userTypeKeyId),
        fieldKeyId: Number(AUTH.defaultFieldKeyId)
    };
    IntermediaryDashboardService.getIntCategory(function (response) {
        if (response != null) {
            if (response.data.isSuccess) {
                $scope.userCategories = response.data.userCategories;
            }
        }
    }, data);
};


  /**
  * @Summary: getIntCategory function, to get the IntCategory
  * @param:   callback, data
  * @return: 
  * @Description:
  */	
  this.getIntCategory = function (callback, data) {
   var url = '/api/userCategories/filter/list/each';
   $http({
      method: 'POST',
      url: url,
      headers: {'Content-Type': 'application/x-www-form-urlencoded'},
      transformRequest: function(obj) {
        var str = [];
        for(var p in obj)
        str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
      return str.join("&");
      },
      data
    }).then(
      function (response) {
        //Success Function
        callback(response);
      },
      function (response) {
        //Failure function
        callback(null);
    }
   }

<ul ng-repeat="category in userCategories" class="ng-cloak">
  <li style=" padding-top: 11px;">
    <a href="#" ng-click="getAlbumInIntermediary(category.categoryKeyId)">
      {{category.categoriesDto.categoryName}}
    </a>
  </li>
</ul>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:0)

简单使用

ng-if="intermediaryAlbumCount.length"

因为0被视为假。

答案 1 :(得分:0)

  

但数据不会显示在HTML页面中

不要将回调与Promises混合。

您在服务中执行异步调用并解析原始Promise。因此,创建新的Promise并将其解析为控制器:

 this.getIntCategory = function (callback, data) {

   var deferred = $q.defer(); 
   var url = '/api/userCategories/filter/list/each';
   $http({
      method: 'POST',
      url: url,
      headers: {'Content-Type': 'application/x-www-form-urlencoded'},
      transformRequest: function(obj) {
        var str = [];
        for(var p in obj)
        str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
      return str.join("&");
      },
      data
    }).then(function (response) {
       deferred.resolve(response.data);
      },
      function (response) {
        deferred.resolve({});
    });
     return deferred.promise;
   }

现在在控制器中你可以写成:

 $scope.getUserCategory = function () {           
    IntermediaryDashboardService.getIntCategory().then(function (result) {
          $scope.userCategories = response.data.userCategories;                           
    }, function (result) {
        alert("Error: No data returned");
     });    
  }  

Fiddle