2013-10-27 2 views
1

У меня есть приложение Ember.js (1.0.0), для которого я пытаюсь реализовать встроенный вид Ember.Select.Ember.Select просмотр жалобы на пройденное значение

Эта часть приложения показывает три списка заданий: inProgress, completed и unassigned. Пользователь может фильтровать задачи, указанные в соответствующем проекте. Это где Ember.Select вид приходит Однако, когда я загрузить маршрут, угасающий лает на меня о типе значения Я даю это:.

Assertion failed: The value that #each loops over must be an Array. You passed projects.all

Uncaught TypeError: Object projects.all has no method 'addArrayObserver'

Uncaught Error: Something you did caused a view to re-render after it rendered but before it was inserted into the DOM.

Я боролся с этим часами, пытаясь использовать разные перестановки кода ниже - и я знаю, что должен пропустить что-то очевидное, потому что это просто не может будет трудно получить такой простой компонент для правильной работы. Надеюсь, вы, ребята, можете указать мне в правильном направлении.

Вот мой маршрут:

Bee.TasksIndexRoute = Bee.Auth.Route.extend 
    setupController: (ctrl) -> 
     # get tasks 
     Bee.Auth.send 
      url: Bee.endpoint "/tasks" 
     .done (tasks) -> 
      ctrl.set "tasks.all", tasks 
     # get projects 
     Bee.Auth.send 
      url: Bee.endpoint "/projects" 
     .done (projects) -> 
      ctrl.set "projects.owned", projects.owned 
      ctrl.set "projects.participating", projects.participating 
      ctrl.set "projects.all", projects.owned.concat projects.participating 

Вот мой контроллер:

Bee.TasksIndexController = Ember.ObjectController.extend 
    project: null 
    content: 
     tasks: 
      all: [] 
      inProgress: [] 
      completed: [] 
      unassgined: [] 
    projects: 
     all: [] 
     owned: [] 
     participating: [] 
    visible: (-> 
     ctrl = @ 
     # filter tasks here    
    ).property "project" 

Вот мой Шаблон:

<script type="text/x-handlebars" id="tasks/index"> 
    <div class="center-pane"> 
     <div class="top_options"> 
      <div class="project_filter"> 
       <strong>Viewing: </strong> 
       {{view Ember.Select 
        content=projects.all 
        optionValuePath='content._id' 
        optionLabelPath='content.title' 
        value=project 
        prompt='All Tasks' 
       }} 
      </div> 
      <strong class="gold-gradient option_button"> 
       {{#link-to 'tasks.create' classNames='new_task'}}Create Task{{/link-to}} 
      </strong> 
     </div> 
     <div class="col3"> 
      <div class="col-header in-progress light-gradient"> 
       <h3>In Progress</h3> 
      </div> 
      <div id="tasks_active_list"> 
       {{#if visible.inProgress.length}} 
        <ul>{{#each visible.inProgress}}{{view Bee.TaskListView}}{{/each}}</ul> 
       {{else}} 
        <p class="no_projects">None</p> 
       {{/if}} 
      </div> 
     </div> 
     <div class="col3"> 
      <div class="col-header completed light-gradient"> 
       <h3>Completed</h3> 
      </div> 
      <div id="tasks_closed_list"> 
       {{#if visible.completed.length}} 
        <ul>{{#each visible.completed}}{{view Bee.TaskListView}}{{/each}}</ul> 
       {{else}} 
        <p class="no_projects">None</p> 
       {{/if}} 
      </div> 
     </div> 
     <div class="col3"> 
      <div class="col-header unassigned light-gradient"> 
       <h3>Unassigned</h3> 
      </div> 
      <div id="tasks_unassigned_list"> 
       {{#if visible.unassigned.length}} 
        <ul>{{#each visible.unassigned}}{{view Bee.TaskListView}}{{/each}}</ul> 
       {{else}} 
        <p class="no_projects">None</p> 
       {{/if}} 
      </div> 
     </div> 
    </div> 
</script> 

Любое понимание будет высоко ценится. Я знаю, что Ember.Select является виновником, так как, когда я заменить его простой:

<select> 
    {{#each projects.all}} 
     <option value="{{_id}}">{{title}}</option> 
    {{/each}} 
</select> 

... это делает хорошо - однако мне нужно использовать Ember.Select таким образом я могу связать ценность project собственности на TasksIndexController - так как я буду использовать это как наблюдаемое для запуска функции visible.

ответ

1

попробуйте установить проекты.все до нуля передняя. возможно, ember select имеет проблему с массивом по умолчанию pojo в классе.

Bee.TasksIndexController = Ember.ObjectController.extend 
    project: null 
    content: 
     tasks: 
     all: [] 
     inProgress: [] 
     completed: [] 
     unassgined: [] 
    projects: 
    all: null 
    owned: [] 
    participating: [] 
    visible: (-> 
    ctrl = @ 
    # filter tasks here    
).property "project" 



setupController: (ctrl) -> 
    # get tasks 
    Bee.Auth.send 
     url: Bee.endpoint "/tasks" 
    .done (tasks) -> 
     ctrl.set "tasks.all", tasks 
    # get projects 
    Bee.Auth.send 
     url: Bee.endpoint "/projects" 
    .done (projects) -> 
     ctrl.set "projects.owned", projects.owned 
     ctrl.set "projects.participating", projects.participating 
     ctrl.set "projects.all", projects.owned.concat projects.participating 

Вот упрощенный пример: http://emberjs.jsbin.com/aletIyU/3/edit

+1

Переход от '[]' в 'null' не кажется, чтобы сделать разницу, однако после того, глядя на пример JSBin я видел, что он использовал Ember 1.1 .1 - поэтому я обновил свою версию 1.0.0 до последней версии 1.1.2, и все работает так, как я ожидал. Вот это боль! Спасибо за косвенный ответ! – sp0rkyd0rky

+0

спасибо @ sp0rkyd0rky! это сводило меня с ума! Сначала я начал с 1.1.1, но использовал канарейки, чтобы проверить некоторые функции. Недавно я вернулся к 1.1.1 и получил эту ошибку. – Jmorvan

Смежные вопросы