Skip to main content

Posts

Showing posts with the label Angularjs

Calling Observable by subscribe .Return data in a subscribe call.

 Calling Observable method using  subscribe  and return data in a subscribe 'd call. Calling method: onClick(fileName){ this ._service. getFiles (fileName). subscribe (filestring  =>  { console.log('filestring',filestring.fileContent); }, (err) =>  { console.log( 'Error to get file' ,err); }); } Called method:  getFiles ( fileName ): Observable <any> { return this ._http .get( this .baseUrl + '/' + fileName , this .options()) . map ((res: Response) => res.json() ) }

Angular UI Routing (angular-ui-router) problem with '-' in the state name - model is not bound in first load.

Issue: angular-ui-router confused with state names separated with '-' . Ex. Sign-up vs Sign-up-user. Though it loads the template it is not binding the model in the first load. You have to click same link again to get the form fields populated. Angular-ui- router - almost treating it as sub url path like in " sign-up.user" the URL will be-  'sign-up/user' .  FIX: Avoid same prefix separated by '-'.  Use  some thing like  'signup-user' instead of 'sign-up-user' that repeats the other route 'sign-up'. Code:   This below code will not populate the form fields first time . app.js  .state( 'sign-up', {           url: '/sign-up',         templateUrl: 'views/sign-up-options.html'       })      .state( 'sign-up-user' , {                 ...

Form Validation in Angular.js - Quick and Simple method On Submit click - HTML5 Validation vs AngularJs Validation

Form Validation Before AngularJs:  Validation done in java script or mostly with JQuery Validation . JQuery Validation uses Html 'Class' attribute of any Html element to implement Validations, like Class = " required  " And there were many different libraries to do simple and fancy validation - highlights in JQuery.  HTML5 Validation: In HTML5 you can add many element types and attributes like below to a HTML element for validations. InputTypes: email, url, number, color , date, datetime, datetime-local, month, search, tel, time, week, range Ex:  Date: <input type="date" name="date" required>  this will show a text box with a dropdown arrow for 'DatePicker' provided by the HTML5 supported browsers. Attributes:    required, pattern, placeholder, max, min, size,  All these validations and required fields are enforced by the HTML5 supported Browsers when you click on Submit button. Submit button OnClick - event will ...