Thank you. I got it. On Monday, 17 November 2014 21:26:14 UTC+5:30, tonypee wrote: > > You are correct that the view and model seem more tightly linked than > other MVC style implementations. Maybe this is partly due to MVVM influence > where the ModelView is seen to represent the model of the view. It also > holds commands which mutate this model. So, the developer will bind to > properties & methods of the modelView. To utilize 2way binding, you need to > directly reference a model in this way (how could you do this just with > events for example?) > > Separation of concerns isn't all about FULLY decoupling elements. For > example, if the controller linked to the view via DOM selectors (jquery > style) then attached its functionality imperatively, then what happens if > you refactor the view? Depending how your selectors are setup, different > changes to hierarchy, naming, or removal of elements (possibly addition), > will cause your selectors to break. So, you are actually linked to the > view, changes in one layer require changes in another. Admittedly, this > could be seen as LESS tightly coupled, but angular's coupling provides > other features, and convenience. > > > > > On 16 November 2014 16:45, Witold Szczerba <[email protected] > <javascript:>> wrote: > >> What exactly is your question here? Is it about creating "hideButton" >> and "isRowDisabled" properties on the actor objects? If that is so, >> then I would agree with you, it does not look OK to me. >> >> Why do you pollute actor objects with stuff like that? Just take those >> properties elsewhere, make the names more meaningful. >> >> You can create presentation model and methods like for example: >> isActorDisabled(actor) >> isActorUpdatable(actor) >> >> and then, in your HTML just use those methods instead. >> >> Do not make the names like "hideButton", try to figure out the real >> meaning and operate using that names in your controllers. >> "isActorUpdatatble" is much better that "hideButton", and you maybe >> provide yet better name. >> >> Imagine you writing a test for that controller. What would be the >> scenarios? Looking at the controller from outside, what do you expect >> it to do? Maybe write a test (runnable specification) to find it out. >> Sometimes it is enough just to think about such a specification and >> sometimes it actually helps to write one. >> >> Regards, >> Witold Szczerba >> >> On Sun, Nov 16, 2014 at 7:12 PM, Mohammad Kamruddin Ali Ahemad >> <[email protected] <javascript:>> wrote: >> > Hello Folks, >> > >> > Below is my HTML code snippet. >> > <style> >> > .selected { >> > background-color: lightgreen; >> > } >> > </style> >> > <script type="text/javascript" src="angular132.js"></script> >> > <script> >> > >> > var app = angular.module('ActorApp', []); >> > var Controller1 = app.controller('Controller1', >> function($scope, >> > $http) { >> > $scope.actorList = []; >> > $scope.fetchAllActors = function() { >> > >> > $http.get(' >> http://localhost:8080/MysqlRestDB/webresources/entities.actor', >> > {responseType: 'json'}). >> > success(function(data, status, headers, >> config) >> > { >> > $scope.actorList = data; >> > }). >> > error(function(data, status, headers, >> config) { >> > >> > }); >> > }; >> > $scope.selectRow = function(row,actor) { >> > $scope.selectedRow = row; >> > actor.isRowDisabled = true; >> > actor.hideButton = true; >> > }; >> > $scope.updateActor = function(actor) { >> > actor.lastUpdate = new Date(); >> > var putData = {"actorId":actor.actorId,"firstName": >> > actor.firstName, "lastName": actor.lastName, "lastUpdate": >> > actor.lastUpdate}; >> > >> > >> > $http.put(' >> http://localhost:8080/MysqlRestDB/webresources/entities.actor'+'/'+actor.actorId >> , >> > putData, {responseType: 'json'}). >> > success(function(data, status, headers, >> config) >> > { >> > //$scope.actorList = data; >> > console.log("Update actor response " + >> data >> > + " status " + status); >> > actor.isRowDisabled = false; >> > actor.hideButton = false; >> > $scope.selectedRow = null; >> > }). >> > error(function(data, status, headers, >> config) { >> > >> > >> > }); >> > }; >> > >> > }); >> > <div ng-controller='Controller1'> >> > <button ng-click="fetchAllActors()">Check Test</button> >> > <table ng-show="actorList.length" border='2'> >> > <tbody> >> > <tr> >> > <th>Actor Id </th> >> > <th>First Name </th> >> > <th>Last Name </th> >> > <th>Last Update Date </th> >> > <th>Click To Edit </th> >> > </tr> >> > <tr ng-repeat="actor in actorList" >> ng-class='{selected: >> > $index===selectedRow}'> >> > <td><input ng-model='actor.actorId' >> > ng-disabled='true'/></td> >> > <td><input ng-model='actor.firstName' >> > ng-disabled='!actor.isRowDisabled'/></td> >> > <td><input ng-model='actor.lastName' >> > ng-disabled='!actor.isRowDisabled'/></td> >> > <td><input ng-model='actor.lastUpdate' >> > ng-disabled='true'/></td> >> > <td> >> > <button ng-click='selectRow($index,actor)' >> > ng-hide='actor.hideButton'>Edit</button> >> > <button ng-click='updateActor(actor)' >> > ng-hide='!actor.hideButton'>Save</button> >> > </td> >> > </tr> >> > </tbody> >> > </table> >> > </div> >> > >> > If you see here i am trying to iterate a list here with ng-repeat. For >> > visibility ofcourse i had to so many logic coupled with the HTML >> elements. >> > It does not look like controller and html are separate and they do >> combine >> > with each other which we can not separate. Am i missing something? Am i >> not >> > following AngularJS standards? Is there any better way to achieve what >> i am >> > doing here? >> > >> > -- >> > You received this message because you are subscribed to the Google >> Groups >> > "AngularJS" group. >> > To unsubscribe from this group and stop receiving emails from it, send >> an >> > email to [email protected] <javascript:>. >> > To post to this group, send email to [email protected] >> <javascript:>. >> > Visit this group at http://groups.google.com/group/angular. >> > For more options, visit https://groups.google.com/d/optout. >> >> -- >> You received this message because you are subscribed to the Google Groups >> "AngularJS" group. >> To unsubscribe from this group and stop receiving emails from it, send an >> email to [email protected] <javascript:>. >> To post to this group, send email to [email protected] >> <javascript:>. >> Visit this group at http://groups.google.com/group/angular. >> For more options, visit https://groups.google.com/d/optout. >> > > > > -- > Tony Polinelli > >
-- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
