Angular x-editable using setter instead of model field - javascript

In my angular controller, my model does not exactly reflect the way the data is displayed on the screen. To display the data anyway, I use a method bound to $scope to extract the data to show.
<a href='#' editable-text="???" onaftersave='setData($data)'>
{{ getData() }}
</a>
Showing the data works fine, but saving doesn't. Lacking an alternative, I used onaftersave to save the data. However, it seems that one needs to specify editable-text in order to get x-editable to work. Is there anything else I can do?

I try to answer my own question (in hope it's of use for anyone who stumbles upon the same problem):
After reading parts of the source code, I think it is not possible to do this. I guess the whole point of having a controller is to transform the data into a format that is easy to display (i.e. in a way that x-editable can directly access it).

Related

Looking for a work around for Ember Restriction "Error: Changing a view's elementId after creation

For our application , we have initial load with data. We use those data to generate dynamic id and classes.
There are another api call we make to reload missing data. now the problem is if reload function bring different information, elementId complains that changing id is not allowed
like this(without api call)
https://ember-twiddle.com/394755fd5b355dd93cd147d4610fbf5e?openFiles=controllers.application.js%2Ctemplates.components.my-component.hbs
now , is there a good work around for this issue keeping this logic?
You're looking for a workaround. so have you considered to not use embers own div?
if you specify tagName: '' on your component, the component itself wont produce a div.
Next you can do <div id={{myId}}>...</div>, which will update correctly.

Polymer accessing model data on-click

I'm trying to add an on-click inside a Polymer dom-repeat section. Looking at the documentation here, Polymer seems to do this automatically and store the data in a 'model' property.
Using this, I've been able to get the data (username) I want by doing this:
let username = event.model.__data__.user.username;
However, although this works, it definitely doesn't look right... Does anyone have any pointers?
So, despite what is printed out if you do console.log(event.model), you can actually just bypass the data altogether and just do:
event.model.user.username;

Properly resolving variable in HTML

So I have a some HTML where I am pulling a value from a file and using it for a link, like so:
page
Now I need a popup to display that page when clicked, using a basic script and a line like this:
page
However, I need the popup page value to be pulled from the file as well, so something like this:
page
But the problem I am having is that the variable does not resolve in the popitup() call, I assume because of the apostrophes basically telling it to take that literally. What could fix this and make it resolve?
This is in conjunction with AngularJS
I'm going to assume that the first snippet you posted. If it works, great; this answer should work for you. If not, well, I don't know - more information would be needed, like a fiddle illustrating the problem or know what templating engine you're using.
Since the function "popitup" needs the save value as the href of the link, why not pass in the href of the link?
page
ngClick is the way to deal with that kind of things if you are using Angular.
This was anserwed here, and if you really need the onclick attribute: how to pass angular js variable inside onclick function as parameter

Filtering by Angular JS Template

I am another Angular JS newbie and have ran into a bit of an issue on how to resolve an Angular JS filter. Anyway here is the HTML of the IDEA of what I want to do. Basically I want to filter by a template that changes based on the the heading witch is also unknown. (As user would have to click link to get to this page and the header would get that certain name and the list would only display results that matches. I apologize, I do not know the technical terms and I am sure there is a simple fix but I do not know which way to take this.
<h1>{{item.name}}</h1>
<ul>
<li ng-repeat="item in items | filter:{category:'{{item.name'}}'">
I know this is not the way to approach this but this is the concept and would appreciate the help. It is hard to search for existing answers when some of the terms are so complex.

How can I use angular directives as custom markup for angular-ui-select2 results?

I'm using angular-ui-select2 to generate a select box.
By default, results displayed in select2 lists simply display a piece of text, but select2 provides a configuration option, formatResult from which one can return custom markup.
I'd like to use another directive I've written as part of the result markup.
This plnkr demonstrates a minimal use case. How can I get the projectLikesCount directive to be compiled and displayed properly within the dropdown?
I was trying to do the exact same but couldn't find a solution. It seems that the population of the results by formatResult is not in the angular lifecycle, therefore whatever markup returned by the function is displayed as is i.e., no directives will be "translated" into behaviour.
An example of this is that if you add the following markup:
<div ng-show='isNewElement'>Add new</div>
it will be rendered every time with no regard to the isNewElement value.
Considering the time this question has been unanswered I guess that it's either really easy or really complicated to achieve the desired behaviour. I'll post if I find a somewhat useful solution.

Categories

Resources