Question

我在一个简单的项目中使用angular，我达到了开发状态，我可以开始将内容分成单独的编码文件。

所以，我有一个带有一个对象数组的变量，叫做oink，如果在我拥有主模块，控制器等的同一个js文件中定义，它可以正常工作，但如果我尝试从中导入它一个外部的json，它不起作用。

我正在使用http：//协议。

代码如下：

var oink;
$.getJSON("exemplo.json", function(json) {
  oink = json;
});

并在json文件中我有

[
 {
    "brand": "Mooo",
    "model": "Moolicious"
  },
 {
  "brand": "Mooo2",
  "model": "Moolicious2"

  },
  {
  "brand": "Mooo3",
  "model": "Moolicious3"
  }
]

添加了app的应用程序版本：

(function() {
var app = angular.module('farm', []);

app.controller('animalController', function(){
this.oinky = oink;

 });

app.controller('TabController', function(){
this.tab = 1;

this.setTab = function(newValue){
  this.tab = newValue;
};

this.isSet = function(tabmodel){
  return this.tab === tabmodel;
};

this.tier = 1;

this.setTier = function(newValue){
  this.tier = newValue;
};

this.tierSet = function(tiermodel){
  return this.tier === tiermodel;
};

this.show = -1;

this.defineBox= function(janein){

  if(this.show>-1 && this.show==janein) {
    this.show=-1;
  } else {
    this.show=janein;
  }
};

this.currentBox = function(janein) {
  return this.show === janein;
};

this.slide = 1;

this.defineSlide= function(number){
    this.slide = number;
};

this.currentSlide= function(number) {
  return this.slide === number;
};

});



var oink;
$.getJSON("exemplo.json", function(json) {
 oink = json;
});




})();

感谢您的帮助。

Answer 1

在您的控制器尝试将其分配给oink时，

this.oinky将被取消定义。将不会创建引用，因此当ajax更新oink时，控制器变量对此一无所知。

我不知道为什么getJSON超出了角度代码。把它放在里面会有帮助

尝试：

app.controller('animalController', function($http){
      var self = this;
      $http.get("exemplo.json").then(function(response){
         self.oinky = response.data
      });

});

Answer 2

您可能违反同源政策。如果您想进一步调查，请在此处阅读更多内容："Cross origin requests are only supported for HTTP." error when loading a local file

无法将json导入Angular中的变量

2 个答案: