CODEWITHSUNDEEP
formsangularjsdatetime
user54600
user54600

Reputation: 268

Angularjs - date/time stamp

I am trying to figure out something using angularjs. Basically, today I decided to add a time/date stamp in my form. In other words, when someone is trying to post something, the time and date will appear.

Since I have a form with a live preview, I was trying to connect the time on the live preview. Afterwards, the time stamp would get published so that I could orderBy the comments from most recent to less recent.

I have two plunkers. For some reason, I couldn't get the code to properly work. Instead of showing up in the live preview as it should, it doesn't at all. It will on the form though. The first plunker has the bare minimum code, and is shown in the following link, while the second plunker is at the bottom of this message.

http://plnkr.co/edit/zgqXGGpoOw3UY90qT23H?p=catalogue

I will still display a portion of the code here, which is where my problem lies:

 <blockquote ng-repeat="review in product.reviews | orderBy:'date'">
                        <b>Date: {{review.date}}</b>
            </blockquote>


           <form name="reviewForm" ng-controller="ReviewController as reviewCtrl" ng-submit="reviewForm.$valid && reviewCtrl.addReview(product)" novalidate>

                <blockquote>
                    <b>Date: {{reviewCtrl.review.date}}</b>
                    <br/>
                </blockquote>

<!-- DATE AND TIME -->

            <!-- The other time formats are at the bottom of this page -->
            <div ng-controller="timecontoller" ng-init="init();">
            <div ng-model="reviewCtrl.review.date" ng-repeat="date in dates">
                <b>Date: {{date.date1 | datetime}}</b>
            </div>
            </div>

            </form>

While the second plunker has the whole viewable portion so that you can visually see the form (I removed certain elements though to make it easier to see). You'll have to click on the word "Review" first.

http://embed.plnkr.co/hHm1OPHk1uFD6YP2Roju/preview

Upvotes: 0

Views: 948

Answers (1)

tgeery
tgeery

Reputation: 174

If i followed your code correctly, it seems that you are trying to assign the review date with this line:

ng-model="reviewCtrl.review.date"

but its really not being given a data model or binding. If you truly wanted to transfer your timecontroller time update to the reviewController then I would recommend not using that as a controller, but instead refactor it as a service. Learn more here. Of course, you could also just open up your timeController scope and use a click event to transfer the data or something like that, but it doesn't seem like it should really be a controller to begin with.

Now i think I ended up changing your code more than it will really help you at all. But here is a quick implementation of how it can be done by making your timeController a service.

Plnkr

Just curious, why do you prefer this to $scope? It was giving me some trouble. Never really dealt with that before.

Upvotes: 1

Related Questions