counting no of array element an array - angularjs

ineed to get the number of elements created at every instance when a button is click
<a class="item-content ng-binding" ng-href="#/lead/details/0/quotation/view/0/" target="_self" href="#/lead/details/0/quotation/view/0/">
2015-10-22 - 1000674
</a>
every time i click on a button a new element is been created with a serial number i need to find out the count of elements after every button clicks
i used
var quotationNumber = element.all(by.css('.item-content.ng-binding'));
it('should display Correct Quotation number in Lead Page',function(){
expect(quotationNumber.getText()).count();
});
my terminal sends an error message TypeError: expect(...).count is not a function. i need the size of that array elements. could some one help me to fix this issue

When you use element.all the returned promise has method count the getText called on element.all(selector).getText() returns an array of text so for that you can use length
var quotationNumber = element.all(by.css('.item-content.ng-binding'));
it('should display Correct Quotation number in Lead Page',function(){
expect(quotationNumber.count()).toBe(3);
});

Have you tried changing expect(quotationNumber.getText()).count(); to expect(quotationNumber.getText().count()); ?

Related

input focus from array

I have an Angular 2+ app which has a component with an array and I have an ngFor which I show and I bind with [(ngModel)] to the elements of the array.
I have a button which adds on click and empty record to the last element of the array to edit. What I want is to focus to the input field which is at the last element of the array.
I think I need to use ViewChildren for that (because it is an array) and not ViewChild. Most tutorials that I have found use ViewChild to focus to a single element. What I want is to focus to the input field of each new record.
Yes you would use ViewChildren for this. ViewChildren returns a QueryList, which has an accessor method for the first and last items in the QueryList intuitively called last. If your ViewChildren variable is called children, you can get the last element with children.last
Putting it all together,
children.last.nativeElement.focus()

Unable to remove items using splice within for loop in Angular

I am trying to remove an item from an existing array using splice but is not working as expected. I even tried using filter instead of splice but got the same output. Can some one please take a look at the functionality here and help me figure out the issue.
Please try to add the available items here - https://08b11a0437.stackblitz.io/products then navigate to the cart page and try to remove each item. The items are not getting removed as expected.
Relevant Code is available in cartservice.ts, cartcomponent.ts(removeProductFromCart()) and cartcomponent.html - https://stackblitz.com/edit/08b11a0437?file=app%2Fcart%2Fcart.component.ts
The problem is you are removing items from an array in cartService, but for the UI you are using values from the products array.
A quick fix is to reload your products array. Just add the following code in your removeProductFromCart function in ShoppingCartComponent. Add it at the end of the function.
this._cartService.getAddedProducts().subscribe((data: IProduct[]) => {
this.products = data.map(item => item[0]);
});
Apart from that there is another issue. You are hiding items in ShoppingCartComponent html using *ngIf="removeItemId !== product.id". Consider you have three products (with id 1,2 and 3) in your cart, when the first products is removed, removeItemId will have 1, so the first product will be hidden. But when the user removes the second product, removeItemId will be set to 2, and now product one will be visible.

How to repeat an array n times using JSX

I am using React/JSX in my app.
i need to reapet data from API n times in first time. if i click on button it reapet more n times. another click-> another n times reapet and over and over.
the api give me 1 results every time. i can define results if it necessary
my code:
const n=2;
arr:[];
handleClick(){
//i need the code to increase n another 2 times
}
//the array here without the code to fill api data. not relevant
this.state.arr.map((d,key)=>
<span>age: {d.age} </span>
<button onClick={this.handleClick} >
Expected result in first results:
age:20
age:24
after click on button:
age:20
age:24
age:48
age:19
Depends on where your API call is, but in order to update the array, you should be using this.setState in your handleClick
handleClick() {
this.setState({
arr: this.state.arr.concat(newContentArray)
})
}
No clue how your obtaining the data, but that's the general principle. Take your existing this.state.arr and concat the array with the new data.
Be sure to use bind or an arrow function on your button event handler.

I want to have a list of images to display randome, which is the best way?

I want to have a list of images that will be displayed in the background of a button randomly every time I click it.
Which is the best way to do it? I assume that not with an array since it has same size since it's initialized, and I think that I would like to reduced the list every time I click the button.
In js:
var array = ["https://madeby.google.com/static/images/google_g_logo.svg","http://searchengineland.com/figz/wp-content/seloads/2015/12/google-amp-fast-speed-travel-ss-1920.jpg"]
//whatever links you want
function go(){
var x = array[Math.floor(Math.random()*array.length)]
document.getElementById("hi").src=x
}
<button onclick="go()">start</button>
<img id="hi"></img>

Select multiple values from ng-repeat and pass to new view with AngularJS

Okay, I'm in a quandary..
The idea: A web app, that can show a list of all the players (in my DB). You should then be able to pick 2 players on the list and press a play button. Then be passed on to a new view WITH the two selected players..
So, what i need is to be able to select to players from my ng-repeat list and then pass their information from my JSON on to the next view.
For now, I just wanna print em' on the next view. I'll be able to figure out how to use them for the game myself once this is done.
Anybody? :(
The best way to select more than one value is using the $index associated with the every element. Push all the selected value into the array, and check for the index of the value in the array.
In Your view:
ng-class="{sel: selected.indexOf($index) >= 0 }"
In your controller
$scope.select= function(index) {
$scope.selected.push(index);
};
working demo:
http://jsfiddle.net/chella89/3G7Kd/173/

Resources