Unable to click button using ng-click for AngularJS application - angularjs

I am automating AngularJS application and need help for ng-click.
Here is the HTML code:
<a ng-click="openProjectModal($event)">Create Project</a>
I tried the code below:
.//a[ng-click='openProjectModal($event)']
Using xpath is working, but i don't want to use xpath.

since it is a link 1st think is you have to javascriptvoid(); to stop it redirection.
and in your controller you should have to write openProjectModal function
i.e
<a ng-click="javascriptvoid();openProjectModal($event)">Create Project</a>
$scope.openProjectModal = function(event){
.............
.............
}
it will might help you

Related

Ionic InAppBrowser - how to print a variable value in single quotes

I am trying to print the value of merchant.merchant_url for my inAppBroswer call. I have looked at the recommended javascript to parse using the A tag at the blog by Nic. https://www.thepolyglotdeveloper.com/2014/12/open-dynamic-links-using-cordova-inappbrowser/
However, this impacts my other links on the app that I do not need to open in the InAppBrowser. Can someone please recomend how can I print this url value? I tried ng-href as well but then the opened site takes over the app and there is no way to exit.
I have also tried using ng-click as suggested here How do I open inAppBrowser using Angular JS?
But this doesn't help either. I know for a fact that merchant.merchant_url has value because i can print it outside my a href. However I having trouble getting it in single quotes for the execution. I have tested non-dynamic links and they work fine in the app. Stripped off < > for the so that the code is readable.
a class="item" href="#" onclick="window.open('{{merchant.merchant_url}}', '_blank', 'location=yes'); return false;"
View
/a
Past this code your controller:
$scope.urlOpen = function(url) {
console.log(url);
window.open(url, '_blank', 'location=yes');
};
and change in your view:
<a class="item" href="#" ng-click="urlOpen({{merchant.merchant_url}})">View </a>
Most of the code posted by xuser is ok. Except that merchant.merchant_url has to be in single quotes.
urlOpen('{{merchant.merchant_url}}')

How to update value in template Angular JS?

I use Angularjs on page for displaying numbers of notes:
<span ng-hide="currentCount.messages <= 0">{{currentCount.messages}}</span>
The value currentCount.messages is got from response AJAX in controller.
Problem is that when I do reflesh browser page I see text {{currentCount.messages}} temporarily.
I tried to define in top controller: $scope.currentCount.messages = 0; but it did not help me.
Try this:
<span ng-hide="currentCount.messages <= 0" ng-bind="currentCount.messages"></span>
Using ng-bind accomplishes the same thing, but you won't see the template string in the page before the angular finishes rendering.

Show directive as result of a click

I want to show content that comes from a directive when the user clicks on a link.
<li>Show popup</li>
Obviously I'm new to angularjs. I know the approach above doesn't make sense really but I was also trying to imagine how this might be done with ng-if but not coming up with anything. Any ideas? Thanks!
Edit 1: The directive that I want to use is:
<ng-pop-up></ng-pop-up>
That's part of ngPopup.
Edit 2: This is now resolved. It turns out that in the case of ngPopup, you put the directive somewhere, then you open the dialog using the open method, so I really didn't take advantage of the solutions given here. Giving Martin credit because his solution solves problem originally stated. Thanks all.
Not exactly sure what you are looking for.
When you say, content from a directive, is this an existing directive, or do you think the content should come from a directive?
In your example where you have show popup, do you mean you would like to have a dialog displayed when you click the link?
Or do you just want something like the following example?
angular.module('app', []);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app=app>
<a href="#" ng-click='showMessage = true'>Click Here</a>
<div ng-show="showMessage">Your Message Here</div>
</div>
Try looking at using ng-if (AngularJS docs). You can use a boolean in your scope to that is toggled by the ng-click.

Injecting "ng-click" in HTML with ngSanitize

I'm working on localization with Angular and I'm stuck with one last thing here.
I have this json blob
{
"key": "_need_to_login_",
"value": "You need to <a ng-click=\"login()\">log in</a> to add an event.",
"description": "Banner alert info tell user to login before they can add an event"
}
So with this Angular i18n module I will be able to do this
{{ "_need_to_login_" | i18n }}
The problem is that it contains some markup in there and it will simple escape it and will display this on the page
You need to <a ng-click="login()">log in</a> to add an event.
But with ngSanitize I'm able to unescape that markup and display it correctly as:
You need to log in to add an event.
But I don't have that ng-click inserted as well.
Try copy that and test it here : http://docs.angularjs.org/api/ngSanitize/service/$sanitize
My question is that how can I insert ng-click from the injected code as well as unescape the string?
ng-bind-html should do what you want. Let me know how it works out, we are planning to add translation support soon to our app.
http://docs.angularjs.org/api/ng/directive/ngBindHtml
Edit2: nevermind about the jsfiddle edit. It didnt work.

Angular JS with jQuery plugin in Supersized

Anyone managed to integrated supersize with angular js?
I tried creating a directive and placing the following code inside a directive
$.supersized({
//params :
supersize did work in creating the
<ul id=supersized" .... >
However my screen isn't displaying supersize's full screen slideshow. Any idea why?

Resources