Ref is null (37767) - actions


#1

Hi, I have strange issue.

  App.ListOfSongsRoute = Ember.Route.extend({    
  actions: {
       handleitemclick: function (item) {
           console.log(item);...

 <li {{action "handleitemclick" item.index }} target="view" class='listLi'>...

When I clicked on li element, console was able to catch right one, but nothing happend and there is error message ref is null in console.

It happend only in visual studio. When I tried copy and paste li element to notepad, this solution was working.

Is there any difference, how visual studio deploys html files, because I don’t have answer for this.

Thanks Luba


#2

Did you paste the code into Visual Studio’s editor? There’s an option in VS that changes your tags’ attributes to lowercase in order to comply with the HTML5 standard, but it doesn’t consider that Handlebars/Ember needs the correct spelling.

Check the exact code in VS and compare it to Notepad’s.


#3

Hi, thanks for comment,

I found solution. As you wrote “check difference between code in vs and notepad”. I tried reformated text by comment code in VS. I commented and uncommented route, view and html code. And it works. It’s little bit funny solution. But I still don’t know, why ember cannot set ref variable on row 37767 in prod. relase 1.9.1 :smile:

Thanks Luba


#4

Hi,

so I definetly found problem. It’s probaby bug in ember. Ember cannot work with commented ember elements. If you comment all “{{}}” or scripts in Visual Studio, there is null exception on 37767 row in prod. relase 1.9.1.

Luba


#5

What do you mean by “commented Ember elements”? Frankly, I don’t think that it’s a bug in Ember.


#6

For example if you do this:

<!--<div>{{#link-to 'search'}}<img src="songbookEmber/images/search.png">{{/link-to}}</div>-->

(used button for comments in VS 2013)

Ember breaks on null exception. In my opinion, it should be correct way for comments.


#7

Well, you should not comment code which contains Handlebars this way. You have to use the Handlebars comments:

{{!-- ... --}}

or

{{! .... }}