获取“未捕获的类型错误:未定义不是函数"；尝试从对象调用 get() 或 set() 时 [英] Getting "Uncaught TypeError: undefined is not a function" when trying to call get() or set() from an object

问题描述

我一直在研究一个模仿这个 emberjs 教程的 ember 模板.但是，我想指定此操作来自的项目"对象，而不是对属性使用相同的对象.这些存储在一个数组中，该数组可通过调用模型访问.当我将对象作为特定操作的参数传递时，我可以记录该对象并查看它是否已定义.但是，当我尝试设置或获取属性时，出现错误:

未捕获的类型错误:未定义不是函数

您可以看到我试图用来解决错误的两种方法，但是，每次调用仍然会导致错误.

方法一:

合同:功能(项目){var indx = this.projects.indexOf(project)控制台日志(索引)；this.projects[indx].set('isExtended', false);}

方法二:

合同:功能(项目){project.set('isExtended', false);}

我认为问题与存储在模型或项目中的数组有关.如果有人对如何解决此类型错误有任何建议，请告诉我.提前致谢，以下是所有相关代码:

HTML:

EmberJS

App.ProjectsRou​​te = Ember.Route.extend({项目:[]，动作:{展开:功能(项目){console.log(this.projects.indexOf(project));project.set('isExtended', true);},合同:功能(项目){var indx = this.projects.indexOf(project)控制台日志(索引)；this.projects[indx].set('isExtended', false);}},模型:函数(){var 对象 = [];//要使用foreach处理数组较少的事情，只需添加索引作为属性.计数也很有价值.金枪鱼 = {bgurl: "img/tunadbo.jpg",title: "金枪鱼",body:Tuna 是一个音乐发现应用程序.但真的是这样吗?今晚，我们进行调查."，content: "这是内容"};最大变量 = {bgurl: "img/great.png",title: "最伟大的",身体:你最相信"，content: "这是内容"};var sus = {bgurl: "img/combatix.png",title: "Combatix",body: "小型视频游戏
",content: "这是内容"}var 信任 = {bgurl: "img/great.png",title: "最信任的信任
",身体:你知道"，content: "这是内容"}objects.pushObject(金枪鱼);objects.pushObject(greatest);objects.pushObject(sus);objects.pushObject(trust);for(i = 0; i

根据@Beerlington 的回答更新 JSBinhttp://emberjs.jsbin.com/davabonoto/2/edit

解决方案

你得到的错误是因为普通的 JavaScript 对象不理解 Ember 的 get/set 函数.有两种方法可以解决这个问题.

1) 您可以在 Ember.Object.create 中包装每个对象字面量:

以下是我正在谈论的示例:

var tuna = Ember.Object.create({bgurl: "img/tunadbo.jpg",title: "金枪鱼",body:Tuna 是一个音乐发现应用程序.但真的是这样吗?今晚，我们进行调查."，content: "这是内容"});

2) 你可以继续使用对象字面量，而是使用 Ember.set 而不是在对象上调用它:

expand: function(project) {Ember.set(project, 'isExtended', true);},

I've been working on an ember template which mimics this emberjs tutorial. However, instead of using the same object for properties, I want to specify the "project" object from which this action comes from. These are stored in an array which is accessed by calling model. When I pass the object as a parameter for the specific action, I can log the object and see that it is defined. However, when I try to set or get the properties, I get the error:

Uncaught TypeError: undefined is not a function

You can see the two methods I attempted to use to work around the error, however, each call still causes an error.

Method one:

contract: function(project){
    var indx = this.projects.indexOf(project)
    console.log(indx);
    this.projects[indx].set('isExtended', false);
}

Method two:

contract: function(project){
        project.set('isExtended', false);
    }

I believe the problem is related to the array stored at model or projects. If anyone has any advice how to remedy this type error, please let me know. Thanks ahead of time and here's all of the relevant code:

The HTML:

<script type="text/x-handlebars" id="projects">
      <div class = "row bodeh">
        <div class ="col-lg-12">
            <h1>Projects</h1>
        </div>
        {{#each project in model}}
          <div {{bind-attr class=project.sass style=project.image}}>
            <div class="cont">
              <h1><a {{bind-attr href=project.lynk}}>{{project.title}}</a></h1>
               <p>{{project.body}}</p>
            </div>
            {{#if project.isExtended}}
              <div class="extraMat">
                <button type="button"{{action 'contract' project}}>Contract</button>
                <p>{{project.content}}</p>
              </div>
            {{else}}
              <button type="button"{{action 'expand' project}}>Expand</button>
            {{/if}}

          </div>
        {{/each}}
      </div>

    </script>

EmberJS

App.ProjectsRoute = Ember.Route.extend({
  projects: [],
  actions: {
    expand: function(project) {
      console.log(this.projects.indexOf(project));

      project.set('isExtended', true);
    },
    contract: function(project){
      var indx = this.projects.indexOf(project)
      console.log(indx);
      this.projects[indx].set('isExtended', false);
    }
  },
  model: function() {
    var objects = [];
    //to handle the array less thing with foreach, just add index as a property. Count is also valuable.
    var tuna = {
      bgurl: "img/tunadbo.jpg",
      title: "Tuna", 
      body: "Tuna is a music discovery application. But is it really? TONIGHT, we investigate. ",
      content: "This is the content"
    };
    var greatest = {
      bgurl: "img/great.png", 
      title: "Greatest", 
      body: "You best believe",
      content: "This is the content"
    };
    var sus = {
      bgurl: "img/combatix.png",
      title: "Combatix", 
      body: "Small video game
",
      content: "This is the content"
    }
    var trust = {
      bgurl: "img/great.png", 
      title: "The Trustiest of the trust
", 
      body: "Ya know",
      content: "This is the content"
    }
    objects.pushObject(tuna);
    objects.pushObject(greatest);
    objects.pushObject(sus);
    objects.pushObject(trust);
    for(i = 0; i< objects.length; i++)
    {
          objects[i].lynk = "http://tunadbo.appspot.com";
          objects[i].image =  "background-image:url('"+objects[i].bgurl+"');";
          objects[i].isExtended = true;
          objects[i].sass = "col-lg-12 col-sm-12 col-xs-12";
          objects[i].sass += " heedthis hvr-fade";
    }
    this.projects = objects;
    return objects;
  }
});

Update JSBin according to @Beerlington's answer http://emberjs.jsbin.com/davabonoto/2/edit

解决方案

The error you're getting is because plain JavaScript objects do not understand Ember's get/set functions. There are two ways you can get around this.

1) You can wrap each object literal in Ember.Object.create:

Here's an example of what I'm talking about:

var tuna = Ember.Object.create({
  bgurl: "img/tunadbo.jpg",
  title: "Tuna", 
  body: "Tuna is a music discovery application. But is it really? TONIGHT, we investigate. ",
  content: "This is the content"
});

2) You can continue using object literals and instead use Ember.set instead of calling it on the object:

expand: function(project) {
  Ember.set(project, 'isExtended', true);
},

这篇关于获取“未捕获的类型错误:未定义不是函数"；尝试从对象调用 get() 或 set() 时的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！