Giter VIP home page Giter VIP logo

Comments (6)

millturnK avatar millturnK commented on June 12, 2024

I would also like to know this :-).

from ng-shopping-cart.

millturnK avatar millturnK commented on June 12, 2024

Actually, in the doco it mentions the @output variables - you just pass these into your own function, i.e. for 'added' output when an item is added to the cart, you could define an 'itemAdded' function in your component class, so this would be the use in the HTML:
<add-to-cart [item]="getBaseCartItem(i)" [type]="'number'" [position]="'top'" (added)='itemAdded($event)'>

PS This is such a helpful library, thanks!

from ng-shopping-cart.

samuelkavin avatar samuelkavin commented on June 12, 2024

@millturnK thank u. How we can use entries() and get update realtime value?

from ng-shopping-cart.

devconcept avatar devconcept commented on June 12, 2024

@samuelkavin The difference between itemCount and entries is that the first returns the number of unique items and the second all of the purchased items in the cart.

Take a look at this example:

  • An user purchased a pair of shoes but when ordering it selected that it wanted two pairs, not just one (because he wanted one for him and another as a gift, for example).
  • He also ordered a new TV but selected only one item this time.

In that case itemCount will return 2; one for the shoes and one for the TV. Those are the "unique items".

On the other hand entries will return 3 because you have two shoes and one TV. Those are the "total items".

from ng-shopping-cart.

devconcept avatar devconcept commented on June 12, 2024

@millturnK The (added) output is not the same as itemAdded in the service. You could have several <add-to-cart> components at the same time in one view and they will only fire on the particular component that added the item while the itemAdded will fire every time on every component that injects the CartService as long as the service was provided at the application level as explained in the docs. Simply put, if you want to listen for global changes to the cart use the service and if you want to listen por changes on a particular <add-to-cart> component use the output event.

from ng-shopping-cart.

devconcept avatar devconcept commented on June 12, 2024

The onItemAdded, onItemRemoved and onChange serves the same purpose, notify you of changes on the cart service. They filter events based on the type of modification that took place (addition or removal). The onChange will fire on every change, the other two are just for convenience. If you want to listen to all changes, setup a subscription on the ngOnInit lifecycle phase of your component and remove it on the ngOnDestroy phase. The source of the <cart-summary> can help you with that.

ngOnInit(): void {
    this._serviceSubscription = this.cartService.onChange.subscribe(() => {
        // React to changes here or call other methods
    });
}

ngOnDestroy(): void {
    this._serviceSubscription.unsubscribe();
}

You could use takeUntil rxjs operators for better cleanup

from ng-shopping-cart.

Related Issues (9)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.