WebStorm doesn't recognize AngularJS 'vm' variable - webstorm

I am currently using the AngularJS plugin. It's really helpful.
The only downside is that it doesn't recognize the vm variable.
I use these settings in my directive to use the vm variable in my view:
controllerAs: 'vm',
bindToController: true
However, WebStorm doesn't recognize it and gives this error:

I have just tested with both WebStorm and IntelliJ with the AngularJS plugin and in both cases the templates that include the ng-controller directive in their root element recognize the variable in the template and those without it do not. I would suggest adding it to your template to solve the problem.
<div ng-controller="commitmentController as cc">
<div class="margin-top-bottom">
<a ui-sref="commitmentList" ng-click="cc.sessionManager.okToContinueWithUnsavedChanges()"
role="button"><span class="glyphicon glyphicon-chevron-left">
</span>Back to All Commitments
</a>
</div>
<!-- Rest of template here -->
</div>

This is a bug in Webstorm. See #tokkov his answer for a possible workaround.
See the bug in the issue tracker here: https://youtrack.jetbrains.com/issue/WEB-20676

Related

How to have the Layout convert a Page written in Markdown to HTML (using Zurb Foundation Panini)

I am using Zurb's Panini site generator. I am using a CMS that outputs a html file written in markdown to the pages folder. My goal was to have the template file convert the markdown to html.
I've tried to have the markdown get converted before it enters the template file but haven't found a way with the CMS I am using (NetlifyCMS). The CMS also needs to be very user friendly for non-technical users.
<!-- This is the part of the template file -->
<article class="cell medium-5 cell-block-y location-info-container">
<h1 class="location">{{title}}</h1>
{{#markdown}}
{{> body}}
{{/markdown}}
</article>
When running foundation build everything works as expected except for the markdown content is still markdown. I have tried to find a workaround but with no luck so I am open to a solution or workaround. Also, a quick apology in advanced, due to client restrictions I am unable to post links and have the project on a private repository.
You have to add a markdown helper using marked or another markdown library.
https://github.com/zurb/panini/blob/dev/readme.md

Load environment variable in template file in Phoenix Framework

In a controller, I can load environment variables defined in config.exs using Application.get_env/3.
Is it possible to do load an environment variable directly inside a template file, aside from passing it through a controller? In particular, I'd like to load it in one of the layout files.
This q/a from 2015 will be helpful. As Dogber said, Application.get_env/3 will do exactly what you want even in a template. Take a look at the template docs. Variables take the form:
<p><%= #key %></p>
So, you can do the following:
<div class="jumbotron">
<h3>This is h3 text</h3>
<%= Application.get_env(:sheldonkreger_app, :some_env_var) %>
</div>
Phoenix uses Elixir EEx templates so the above gets built at compile time and is safe and ready to use in your app.

Jinja2 django 1.6 How to eliminate quotes from include tag?

Is this a bug? I have codes in template file like:
<div class="row" id="tags">
{%include 'y.html'%}
</div>
then jinja2 will render as:
But I never have any quotes in my template. And if I directly place codes in y.html in div section, this problem won't happen.
So, If I have to use include tag, How can I eliminate those annoying quotes?
EDIT:
Thanks for Daniel Roseman, the quotes only exist in Chrome tools, not in the actual html code. BUT:
If I use Chrome browser and use include tag, the layout is abnormal:
If I use Chrome browser and don't use include tag , the layout is OK:
So, there must be something wrong with jinja2 or chrome.
If it is caused by Jinja2, then how to solve this problem? Thanks.
EDIT2:
more strange things: if I move the <div class="row" id="tags"></div> into y.html, the problem will disappear even if I still use include tag.
This may be the solution, but still I don't why.
This isn't Jinja2 doing anything. This is your just your browser's developer tools. The actual HTML will be fine.

Play 2, how to reuse a HTML code with a tag

In Play! Framework v. 1.x there was such thing like a 'tag' where was possible to reuse some thml/template code.
In Play! Framework v 2.x, for me it is not clear still how it's going to be used (here).
For example, I want to use tag to define a header for my site (in order not to repeat myself, but just include the header every in the pages where I need it).
Could someone explain me / show how to use tags, or whatever I should use to include the header or any block of html/template code.
You showed us a sample and you are asking for sample :)
That's easy, create a common view in views.tags package (remember to leave first line empty if you're not gonna to pass any params! also remember to add brackets after tags name):
/app/views/tags/header.scala.html
<div id="header">
<h1>Hello World!</h1>
</div>
So you can 'include' it in any other view just with:
<body>
#tags.header()
Some other content
</body>

Foundation 6 flex grid and predefined floats

I like the idea of flex-grid and was wondering if I'm using it correctly. I started a build using Foundation 6 / SASS and did #include foundation-flex-grid;
While building a basic page I noticed in my DevTools that certain items from the Kitchen sink are using styles on items that have their displays set to block and float on them.
Example: .title-bar
<div class="title-bar">
<div class="title-bar-left">
<button class="menu-icon" type="button"></button>
<span class="title-bar-title">Foundation</span>
</div>
<div class="title-bar-right">
<button class="menu-icon" type="button"></button>
</div>
</div>
The elements .title-bar-left and .title-bar-right have corresponding floats on them. I know that floats are unnecessary in flex-grid.
My question(s):
Should I keep building away using flex-grid or should I be doing
something extra to remove/replace those styles ahead of time?
It seems to me that the Kitchen Sink on the Foundation Site is
tailored for the normal grid, is it safe to use these elements in
flex-grid with little modification, or will it require lots of
rewriting of SASS/CSS?
For #2, 'Kitchen-sink' can pass true to turn on flex-grid like so:
#include foundation-everything(true);
They might have added this sometime in F6.1 or F6.2; official docs don't reflect this, but I put in a PR to.
For #1, might be more of a bug question than a best-usage issue, perhaps you should submit it?