Question

我的数据对象不会以html显示！

我正在使用parse.com，当我在console.log（结果）时，我可以向下钻取并在检查窗口中查看我的对象属性。

app.controller('membershipCtrl', ['$scope', function($scope) {
  var membership = Parse.Object.extend("Membership");
  var query = new Parse.Query(membership);
  query.ascending("priceDate").greaterThan('priceDate', currentTime).limit(1);
  query.first({
    success: function(results) {
      $scope = results;
      console.log($scope);
    },
    error: function(error) {
      alert("Error: " + error.code + " " + error.message);
    }

  });
}]);

从检查窗口：

attributes: Object

price: 90

priceDate: Mon Feb 01 2016 11:17:00 GMT-0700 (MST)

priceDescription: "Thru Sept 2016"

我的HTML是：

<div ng-app="myApp" ng-controller="membershipCtrl">
    {{price}}{{priceDescription}}
</div>

Answer 1

您的成功功能是覆盖整个$scope变量，而不是在其中放置值。您需要执行后者才能实际访问您的视图：

success: function(results) {
    $scope.price = results.price;
    $scope.priceDescription = results.priceDescription;
    console.log($scope.price);
    console.log($scope.priceDescription);
},

Answer 2

更新：在此处查找小提琴的工作版本：https://jsfiddle.net/h4od21fs/1/

所以你在这里有很多问题：

正如其他人所说，Parse和angular在没有角度插件的情况下彼此不了解，所以在你的情况下你需要在获得数据后调用$scope.$apply()
你把把手插在一起有棱角并且布局完全混乱
你不能只使用解析返回的对象，它会返回活动记录，因此你需要调用方法从中获取实际数据，即：

vm.results.price = results.get（＆＃39;价格＆＃39;）
并且在你的小提琴中你不包括angular.js，但包括很多其他东西，比如bootstrap，handlebars和jquery。
也不要忘记在parse.com上更改密钥，这样就没有人会使用你的配额。

结果代码：

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

app.run(function() {
  Parse.initialize("Clfupzjbt9iWIdezPCZuBJqajuxHJ8okP5nteViS", "sakt1qjwM4duTAo3ZCvWWBM32Tv3ZdL13PQ0Eea4");

});

var currentTime = new Date();
currentTime = new Date(currentTime.getTime() - 25200000);

app.controller('membershipCtrl', ['$scope', function($scope) {
  var vm = this;
  vm.results = null; 
  var membership = Parse.Object.extend("Membership");
  var query = new Parse.Query(membership);

  //query.ascending("priceDate").greaterThan('priceDate', currentTime).limit(1); 
  // i commented it out as it was not returning any data with those conditions

  query.first({
    success: function(results) {
      vm.results = {
        price  : results.get('price'),
        priceDescription: results.get('priceDescription')      
      };
     $scope.$apply();
     console.log(vm);
    },
    error: function(error) {
      alert("Error: " + error.code + " " + error.message);
    }

 });
 }]);

当您在控制器内部执行$scope = smooth时，您不会更改范围，而是更改分配给控制器功能的$scope参数的变量。当它作为引用传递时，它不会影响传递给控制器的$scope对象。

您应该在范围上添加属性，或者如果您使用ControllerAs语法，则应添加到控制器本身，即$ scope：

$scope.results = results  // inside your success callback

对于controllerAs语法：

app.controller('membershipCtrl', ['$scope', function($scope) {
  var vm = this;
  var membership = Parse.Object.extend("Membership");
  var query = new Parse.Query(membership);
  query.ascending("priceDate").greaterThan('priceDate', currentTime).limit(1);
  query.first({
    success: function(results) {
      vm.results = results;
      console.log(vm);
    },
    error: function(error) {
     alert("Error: " + error.code + " " + error.message);
    }

 });
 }]);

在html中：

<div ng-app="myApp" ng-controller="membershipCtrl as vm">
   {{vm.results.price}}{{vm.results.priceDescription}}
</div>

Answer 3

据我所知，您正在覆盖整个$scope对象，该对象具有您需要维护的某些属性，以保持Angular应用程序正常运行并保持绑定完整。

您要做的是将返回的值存储为$scope对象的属性。而不是$scope = results;你应该做一些单独的声明：

$scope.price = results.price;
$scope.priceDescription = results.priceDescription;

...等等，您要在HTML模板中引用任何属性。

请记住，$scope不仅仅是值的存储，而是一个在Angular框架的其余部分的上下文中可以很好地运行的对象。如果您希望在覆盖之前查看它的唯一属性console.log($scope)（或者在将声明修改为上述模式之后）。

Answer 4

有几个问题：

Parse不是角度核心的一部分，因此您需要告诉角度在更改范围时更新视图。

您应该将数据分配给范围属性，而不是覆盖范围对象。一个简单的方法是angular.extend()，它将使用与$scope对象相同的属性和值更新results

query.first({
    success: function(results) {
      angular.extend($scope,results);// merge results into scope
      $scope.$digest();//notify angular to run digests
      console.log($scope.priceDescription);// check one of the new properties added
}

来自控制器的角度对象不在html中显示

4 个答案: