Why does this not work:
<ul class="dropdown-menu">
<li ng-repeat="choice in dropDownItems">
<a class="btn" ng-click="mnuClick('{{choice}}')">{{choice}}</a>
</li>
</ul>
But this does work:
<ul class="dropdown-menu">
<li ng-repeat="choice in dropDownItems">
<a class="btn" ng-click="mnuClick('xxx')">{{choice}}</a>
</li>
</ul>
In the top example, the mnuClick() routine never gets called, but in the bottom example, it does. When I do an 'inspect element' everything looks fine.
It does not work, because the way you did it you are saying that you want to provide the string {{choice}} to the mnuClick function.
When providing xxx, this is actually correct, hence you need the quotes here.
But when using {{choice}}, you don't want THAT string, but you want that expression to be evaluated and its result (which is probably a string) as a parameter - hence you don't need the quotes (and not even the curly braces) here.
So just write
<a class="btn" ng-click="mnuClick(choice)">{{choice}}</a>
and you're fine :-).
To cut it short: In one case you deal with an expression which resolves to a string, in the other case you deal with a string directly. Hence one time you don't need quotes, the other time you do.
If you want more detailed information on when to use curly braces and when not, check out this answer to this question: Difference between double and single curly brace in angular JS?
Hope this helps.
PS: Inside the text of your a tag, you need the double curly-braces, as you're not in a AngularJS controlled code-block here - hence you have to mark it as binding, otherwise it'd just be text inside of HTML.
The value of ng-click is interpreted as an angular expression so you don't have to use the curly brackets around "choice". Just write it like this:
<a class="btn" ng-click="mnuClick(choice)">{{choice}}</a>
Doesn't this work?
ng-click="mnuClick(choice)"
I've definitely done something along those lines plenty of times, but don't have code to hand to verify...
Related
I would like the change the layout of a web application but it is UTF-8 encoded. I have managed to use some online decoders and I know which part to modify but the decoding doesn't seem fully complete to work.
I want to move the div tag marked with * inside the previous one so instead of two lines I can have the data on one line which gives more on screen space.
<li class='ipsDataItem chat_row {{#callme}}ipsDataItem_new{{/callme}}' id='{{id}}'>
<div class='ipsPad_half {{#memberPhoto}}ipsPhotoPanel ipsPhotoPanel_tiny{{/memberPhoto}} ipsClearfix'>
{{#memberPhoto}}
<a href='{{memberUrl}}' class='ipsUserPhoto ipsUserPhoto_tiny' id='ips_uid_{{memberID}}'>
<img src='{{memberPhoto}}' alt=''>
</a>
{{/memberPhoto}}
<div>
<a href='#' data-action='mention' data-member='{{memberName}}'>{{{memberNameFormat}}}</a>
<span class='ipsPos_right'>
<span class='ipsType_small ipsType_light'>{{time}}</span>
{{#canEdit}}<a href='#' data-action='editMSGButton' data-id='{{id}}'><i class='fa fa-pencil-square'></i></a>{{/canEdit}}
{{#canDelete}}<a href='#' data-action='remove' data-id='{{id}}'><i class='fa fa-minus-square'></i></a>{{/canDelete}}
</span>
* <div class='ipsList_inline' id='chatraw_{{id}}' data-id='{{id}}' {{#canEdit}}data-action='editMSG'{{/canEdit}}>{{{message}}}</div>
</div>
</div>
</li>
This is the original encoded xml: https://pastebin.com/papiW75B
and this is what I managed to decode: https://pastebin.com/q24UfAEn. As you can see, the beginning part (line 1) is still a total mess but from line 2 forward it's all good.
What am I missing here? Should I do the decoding in another way?
I wouldn't describe that as being "UTF-8 encoded". It looks to me like obfuscated Javascript. It looks to me as if it's been deliberately obfuscated in order to prevent you doing what you are trying to do -- which I would describe more as reverse engineering rather than decoding. (Indeed, what you are trying to do might well be technically illegal unless you have permission from the copyright owner).
You've already done quite a good job at defeating the intentions of the people who created this application, and I don't think I can help you do any better.
I would like to change the following line:
$("<ul><li>"+displayName + ""+"<br>"+description+"</br></li></ul>".appendTo(".results")
into the next string:
$("<ul><li><a href={0}> {1}" + "</a>"+"<br>"+description+"</br></li></ul>",{0:url, 1:displayName}.appendTo(".results").
however, instead of displayName i get 1.
please help to fix this
As you can see i've tried to write it like in c#
Using ES6 string interpolation, it would look like this:
$(`
<ul>
<li>
<a href=${url}> ${displayName}</a>
<br>${description}</br>
</li>
</ul>
`).appendTo(".results");
Notice the back-ticks instead of double-quotes.
I have this HTML tag <a href="abc> google </a>, how can i put the " after the letter c using regular expression
HTML: <a href="abc> google </a>
Regex: /\=\s*["“'”](.*?)[^“"'”]\s*\>/g
Replace: ="$1">
https://regex101.com/r/1FQods/1
https://jsfiddle.net/liev04/6n038nvm/
How about
str.replace(/href="[^\s>"]+/, function(match) { return match+'"' });
I suggest the following:
str.replace(/=\s*["']([^"']*?)\s*?(?=>)/g,'="\1"');
This should work also in cases where the second " exists already. It also allows for blanks between the = and the beginning of the string.
See here for a demo: https://regex101.com/r/xo52ka/1
Another issue might be cases like:
<a href="abc def > google </a>
My Solution will turn that into
google
But, of course, this solution has its limitations and is by far not watertight. It will only work on the last attribute of each tag (because of the lookahead (?=>) in the regexp).
I am new to angularJS.
As I was trying out the ng-repeat, I found a problem in my code (shown below)
<ul class="dropdown-menu" role="menu" ng-init="names=findDomains()">
<li><a style="cursor:pointer" ng-repeat="x in names" ng-click="selectDomain({{ x }})">{{ x }}</a></li>
</ul>
The idea is that I have a drop-down menu (e.g. with name "test") on my page. When clicked, it displays the selections, and the options are displayed as contents in <li></li>. All options are returned as a set by function findDomains() and initialized by ng-init.
When a particular option (content in <li></li>) is selected (e.g. with name "opt1"), the text of the drop-down menu is updated with the name of the option ("opt1" replaces "test"). This is implemented by function selectDomain()
Since it is the same content get displayed and call selectDomain(), I put two {{x}} calling ng-repeat, hoping the same option displayed calls the selectDomain().
However, everything else seems working fine (findDomains(), ng-repeat and the second {{x}} outside <a></a>). But the {{x}} inside <a></a> does not work properly. When options are clicked, the dropdown menu name is not updated.
But the selectDomain() function is good as it works fine with plain text ( such as ng-click="selectDomain('opt1')).
Any guidance?
Per Doc
ng-click needs an Expression to evaluate upon click
No need of using interpolation thereng-click should not use {{}} interpolation directive, they to have direct access to scope variables inside it.
ng-click="selectDomain(x)"
When passing variable to registered in scope function, you don't need to wrap it in {{}}.
Try below code, it will work:
<ul class="dropdown-menu" role="menu" ng-init="names=findDomains()">
<li><a style="cursor:pointer" ng-repeat="x in names" ng-click="selectDomain(x)">{{ x }}</a></li>
</ul>
Use {{x}} when you want to put variable value in HTML only.
Actually this was a no brainer. I had it worked by removing the curly braces and put ng-click="selectDomain(x)"
I'm trying to match and replace broken HTML using a regex, but I've done a couple of full circles with grouping and lookbacks and quantifiers. I'm struggling to match every scenario.
JavaScript, because the issue is triggered in a Web client browser HTML editor.
The broken HTML is specific - any text between a closing LI and the closing list UL or OL, that is not properly formed as a list item.
For instance, this piece here, from the greater example underneath:
</li>
bbb<strong>bbbb</strong><strong>bbb <span style="text-decoration: underline;"><em>bbbbb</em></span></strong>=0==
</ul>
Here is the full example of where the issue could exist:
<ul>
<li>1111</li>
<li>Could be anything here</li>
<li>aaaa</li>
bbb<strong>bbbb</strong><strong>bbb <span style="text-decoration: underline;"><em>bbbbb</em></span></strong>=0==
</ul>
<ol>
<li>more?<li>
<li>echo</li>
</ol>
This is what I intend the HTML to look like using a match + replace.
<ul>
<li>1111</li>
<li>Could be anything here</li>
<li>aaaabbb<strong>bbbb</strong><strong>bbb <span style="text-decoration: underline;"><em>bbbbb</em></span></strong>=0==
</ul>
<ol>
<li>more?<li>
<li>echo</li>
</ol>
A few expressions I've tried are the following, but depending on these (or slight variations), I'm matching too much or not correctly or something:
/<\/li>.*?<\/[ou]l>/mig
/<\/li>([\s\n]*[\w!\.?;,<:>&\\\-\{\}\[\]\(\)~#'"=/]+[\s\n]*)+<\/[ou]l>/mig
/<\/li>([\s\n]*[^\s\n]+[\s\n]*)+<\/[ou]l>/i
Searched for a couple of days on and off, no luck.. I realise I'm probably asking something answered hundreds of times before.
it's recommended to use a dom based approach to pocessing html
using jQuery:
$('ul>:not(li)').wrapAll('<li></li>');