Posts

Showing posts from October, 2017

Angularjs $http spring rest controller – 404 error

I am getting 404 error on making a $http call from angularjs to spring controller, here is the code : Factory : factory.checkCodeAvail = function(url){ return $http({ url: url, responseType:"json", method: "GET", headers: { "Content-Type": "application/json" } }); } This factory method is called by controller : commonFactory.checkCodeAvail('findDepartment') .then(function (success){ console.log(success); },function (error){ console.log(error); }); This is the error i m getting in browser console : GET http://localhost:8080/TexERP/findDepartment 404 () Spring controller : @RestController public class AdminController { private static final Logger logger = LoggerFactory.getLogger(AdminController.class); @RequestMapping(value=...

Check if Current Time is Between Opening & Close Times with Angularjs

I’m trying to indicate if a business is open given the current time of day, an open time, and a close time. Here’s my time format. $scope.open = "1970-01-01T13:00:00.000Z"; // We can ignore the dates $scope.close = "1970-01-02T22:00:00.000Z" Is there a simple & surefire way to determine this in Angularjs? Something like <div ng-if="currentTime >= open && currentTime < close"></div> I have found several moment libraries that could possibly handle this, but I feel like importing a whole library is overkill for a basic time comparison, and most of the javascript solutions I’ve come across don’t handle this time format. Any input is appreciated! Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/22/check-if-current-time-is-between-opening-close-times-with-angularjs/ via @lzomedia #developer #freelance #web #lzomedia.com

is it possible not to execute the promise (.then ()) in the controller when there is an error in a web request?

I’m currently using a factory called http that when I invoke it, I make a web request. this receives as a parameter the url of the web request. app.factory('http', function ($http) { var oHttp = {} oHttp.getData= function (url) { var config={ method: 'GET', url: url } return $http(config).then(function(data) { oHttp.data=data.data; },function(response) { alert("problem, can you trying later please?") }); } return oHttp; }); function HelloCtrl($scope, http) { http.getData('https://www.reddit.com/.json1').then(function(){ if(http.data!=undefined){ console.log(http.data) } }) } I would like the promise not to be executed on the controller if the result of the web request is not satisfied or there is a problem. is there any better solution? I want to avoid doing this every time I make a web request, or do not know if it is the best way (see the if ): //I am putting "1" to...

Array attribute not parsing to angularjs Directive

My directive is angular.module('app').directive('authorDirective',authorDirective); function authorDirective() { return { restrict: 'E', scope: { Authors: '=', details: '&', name : '=' }, replace : true, template: '<table class="table"><thead>'+ '<tr><th>Name</th><th>Nationality</th><th>Dates</th></tr></thead>'+ '<tbody ng-repeat="model in Authors">'+ '<tr><td></td><td></td><td></td></tr>'+ '</tbody></table>' }; } Controller is angular.module('app').controller('LabController',LabController); function LabController () { var vm = this; vm.Authors = [ {Name : "Mark Twain",Na...

are these ui-sref states ie11 friendly

When trying to navigate with IE11, the links do not work with a state such as url: '/main-category/:id' but the “parent” state url: '/:main-category/' works fine. These are not true nested or parent-child since they don’t actually share any common views/html template, except for navigation. I found this meta tag suggestion and this IE events suggestion, but neither seem to be providing a solution for why my navigation bar AND links from another state do not function. Here is a live site without minify, to test compare IE11 & all other browsers. So, are these routes correctly setup? router.js angular.module('app_litsco') .config(['$stateProvider', '$urlRouterProvider', '$locationProvider', function ($stateProvider, $urlRouterProvider, $locationProvider) { $urlRouterProvider.otherwise('/'); $stateProvider .state('home', { //this state works url: '/', ...

Angular 4. What is :host in angular CSS?

I have trouble understand the concept of :host selector in Angular CSS. What exactly does it do? I looked at here https://angular.io/guide/component-styles . It starts talking “host element” and “parent component” which are equally confusing since I can’t find a concrete definition online. What exactly is host element? What makes a component a parent component? Then there is an example of :host on this blog: https://www.concretepage.com/angular-2/angular-2-4-component-styles-host-host-context-deep-selector-example But it looks like :host just creates a bunch of rectangles on top of each other?? It said “The style written in :host selector in CompanyComponent will be applied in host element in PersonComponent and so on” But what style is applied? It just create a rectangle with :host and paste it on other template Please I need help. Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/22/angular-4-what-is-host-in-angular-css/ via @lzomedia #develop...

Web application architecture with zend framework 3 and AngularJS

Image
I am building a web application with Zend Framework(backend) 3 and AngularJS 1.6.x. I have created a project architecture for the application. I have saved the angular app inside the public directory of the zend framework. Is this a valid and secure architecture? Should i move the files like node_modules outside the public directory? Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/22/web-application-architecture-with-zend-framework-3-and-angularjs/ via @lzomedia #developer #freelance #web #lzomedia.com

Force angularjs attribute directive to not parse its value

I am making an attribute directive that will work similarly to ng-if . window-match-media="(min-width: 400px)" which will make the element render if the media query matches and disappear otherwise. I am modeling my directive on the code for ngIf It works great with the exception that I have to currently enclose the media query in an extra pair of quotes. This is because without it, it seems to try to parse the attribute value . This makes sense for ngIf but in my case I want to simply treat the value as a string. I see nothing in the ngIf codebase that would allow me to indicate that the value should not be parsed, and adding scope: { windowMatchMedia: '@', }, does not help (I’m not sure attribute directives can isolate scope anyways?). I access the value via the $attributes parameter to the directive’s link function which always does seem to provide it as a string, but if I do not specifically make it one with quotes ie window-match-media=...

AngularJS callback error and is not a function

I have an error in line callback(response.data) telling that callback is not a function . Well, I am new to this and I am trying to figure out how to fix this issue but I am having a tough time. Any idea is appreciated. Thanks app.service('NotificationPollService', function ($q, $http, $timeout) { var notification = {}; notification.poller = function (callback, error) { return $http.get('api/sample.php').then(function (response) { if (typeof response.data === 'object') { callback(response.data); } else { error(response.data); } $timeout(notification.poller, 2000); }); } notification.poller(); return notification; }); Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/22/angularjs-callback-error-and-is-not-a-function/ via @lzomedia #developer #freelance #web #lzomedi...

How to place the md-sidenav handler as child of sidenav himself

I am interested into know id if possible (based on this example ) put the Toggle right button as child of the right md-sidenav , this should keep fixed in respect to the parent bu keeping visible when sidenav is closed. This is an example: https://devitems.com/html/subas-preview/subas/index-2.html Regards and thanks in advance. Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/22/how-to-place-the-md-sidenav-handler-as-child-of-sidenav-himself/ via @lzomedia #developer #freelance #web #lzomedia.com

Accessing port 4200

Image
Kindly help me… When I try to host,it shows error message like this Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/21/accessing-port-4200/ via @lzomedia #developer #freelance #web #lzomedia.com

why providerRoute is not working

var app = angular.module('MyApp', ['ngRoute']); app.config(function ($routeProvider) { $routeProvider .when("/Home", { templateUrl: "Home/EmployeeList", controller: "listController", }) .when("/Home1", { templateUrl: "Home/EmployeeTable", controller: "tableController", }) .otherwise({ redirectTo: "/Home/Index" }) .controller("listController", function ($scope) { $scope.message = "In list controller"; }) }); why on running code TypeError:routeProvider.when(…).when(…).otherwise(…).controller error shows in cosole. Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/21/why-providerroute-is-not-working/ via @lzomedia #developer #freelance #web #lzomedia.com

HTML cache manifest and dynamically loaded images

I have a web app with offline functionality. I managed to get the manifest working properly with all the required assets; css, js and images. However I use angular to get from the server a list of user generated images, in a similar manner: $scope.images = angular.fromJson(localStorage.getItem('images')) || [] $http .get('/my-rest-endpoint') .then(function(res){ $scope.images = res.data localStorage.setItem('images', angular.toJson(res.data)) }).catch() I use the localStorage to keep the list even if the user is offline, however I would like to have these pictures included in my offline cache… Any idea how to achieve this? BONUS: In the future there may also be video files. What to do in that case? Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/21/html-cache-manifest-and-dynamically-loaded-images/ via @lzomedia #developer #freelance #web #lzomedia.com

ng-show doesn’t work correct with value boolean

I have one issue like that: <input type="text" ng-model="keyword" ng-change="filterItemByName()"> <ul class="suggestion-list dropdown-menu" ng-show="isSearching"> <li ng-repeat="item in list"> <span ng-click="handleAction(item);"></span> </li> </ul> And here is the js: $scope.isSearching = false; $scope.filterItemByName = function(){ //handle for searh item $scope.isSearching = true; }; $scope.handleAction = function(item) { console.log(item); $scope.isSearching = false; }; The problem in here is, when input the keywork, my app will call an request to get the list (suggestions), but when i click on the item in the list, nothing happend, it doesn’t log anything, it didn’t call handleAction as is. I just found the problem related about the $scope.isSearching, when we show like above, the ng-click doesn’t trigger. But if i do : <ul class=...

ng-model not work within ng-if and ng-repeat, AngularJs?

I have the following template: <tr ng-repeat="dailyInformation in TradodModel.Model.EmployeeDayRelatedData.DailyInformation track by $index" ng-click="DailyInformationRowOnClick(dailyInformation, $event)" data-selected="" data-rowindex=""> <td ng-if="!IsHourlyContract() && DailyOverShowType() != @((short) DailyOverShowTypeEnumeration.NotShow) && !DailyOverType()" data-changed="" title="" class=""> @if (ViewBag.HasWritePermission) { @Html.BootstrapTimeTextBox("OverTimeTextBox", "", false, false, 2, false, new Dictionary<string, object> { {"data-disableindexing", "true"}, {"ng-if", "DailyOverShowType() == " + (short)DailyOverShowTypeEnumeration.Editable}, {"ng-model", "d...

I want to move focus left right up down in html table

this is C# loops which create html table string from controller for (int j=0; j< ds.Tables["tblMaster"].Rows.Count;j++) { html += " <tr>"; //cell for customer name html += "<td class='bg-primary' onclick=CashMemo('"+ fromDate +"','"+ ToDate +"',"+ ds.Tables["tblMaster"].Rows[j]["intPoductId"].ToString() +","+ ds.Tables["tblMaster"].Rows[j]["intCustomerId"].ToString() + ")>" + ds.Tables["tblMaster"].Rows[j]["varName"].ToString()+"</td>"; if (ds.Tables["tblMaster1"] != null) { ds.Tables["tblMaster1"].Clear(); } string query1 = ""; //product id ...

Angularjs ngresource getting peoblems for promise and resolve

I have a controller and there I call a service. var rowCollection=[]; allCars.car('getAllcarList').getAllcarList({}).$promise.then(function(data) { rowCollection.push(data.cars); }); console.log(rowCollection); After the service call If i want to use the rowCollection it shows undefined as the response till not come.How to stop execution until response come. So that the variable can use any where in the program. In my service I have code like this function($resource) { var apiResourceUrl='http://127.0.0.1/stock/api/public/index.php/'; var factory = {}; factory.allCars= function(queryType) { var hsRESTUri = apiResourceUrl; if (queryType == 'getAllcarList') { hsRESTUri = apiResourceUrl + 'getAllcarList'; } return $resource(hsRESTUri, {}, { getAllcarList: { method: 'GET', } }); }; return factory; Sourc...

Check that token is valid or invalid using jwt

Hey I have one small problem with token in app. I have middleware to check token in next routes and I use tokne to isLoggedIn function in angular to check logged users. But if I change token in local storage user still is logged because token still exist but is invalid. Could you help how I can response from middleware that token is valid or invalid and next check this in angular? Question: How check that token is valid or invalid in angular? e.g. if token is invalid change route location Please look on my code: middleware router.use(function(req, res, next){ var token = req.body.token || req.body.query || req.headers['x-access-token'] if(token){ jwt.verify(token, secret, function(err,decoded){ if(err){ res.json({success:false, message:'Invalid token'}) } else { req.decoded = decoded; next() } }) } else { res.json({ success: false, message:'No token provided' }); } }); factory...

Spring Boot ngRoute

I’m trying to make a single page application with a Spring back end and an AngularJS front end. I’ve followed tutorials and looked up similar questions but ngRoute just doesn’t seem to work with a Spring back end (I got it to work with a NodeJS back end). index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"/> <title>Spring Demo</title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-route.js"></script> <script src="../static/index.js"></script> </head> <body ng-app="index" ng-controller="indexController"> <a href="/test">test</a> <div ng-view=""></div> </body> </html> test.html <div> Template lo...

Is this image confirms me that i have definately installed angular CLI globally or not?

Installation of Angular CLI globally Does it surely mean that angular CLI globally is installed on my ubuntu ?? Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/21/is-this-image-confirms-me-that-i-have-definately-installed-angular-cli-globally-or-not/ via @lzomedia #developer #freelance #web #lzomedia.com

Angular input type="select url"

I have a input where you can type in a URL. Now I also like to add a suggestion list to the input where you can select predefined URLs. My attempt was to change from type=url to type=select and provide a datalist: <input type=select list=servers required ng-model=server /> <datalist> <option label="Server example 1" value="https://www.google.de/"/> </datalist> But now I am missing the URL validation from angular. Is there a way to combine those two types? Or any other suggestion how I can do that? Thanks in advance Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/20/angular-input-typeselect-url/ via @lzomedia #developer #freelance #web #lzomedia.com

How to recompile a div in angular after add dynamic content

i am just adding some dynamic content in a tbody.something like below… <tbody id="fileUploadPanel" ng-init="newCtrl.filecount = 1"> <tr class="fileUploadTemplate"> <td align="center"> <img id="image" alt="Img" class="img-responsive pointer" src="../../../Images/new-thumb.svg" height="200" width="200"> </td> <td class="cellClass"> <div class="fileinput fileinput-new input-group" data-provides="fileinput"> <div class="form-control" data-trigger="fileinput"> <i class="glyphicon glyphicon-file fileinput-exists"></i> <span class="fileinput-filename"></span> </div> ...

Intercept each http calls an ES6 approach

I wanted to write injectable service in Angular which can intercept all ajax calls. Basically before ajaxStart and after after finished. I am able to achieve by this code-snippets. But I am able to achieve it using es5 syntax. How I can do the same thing by extending XMLHttpRequest which is shown in file no: 3? 1) http-interceptor.ts import { Injectable, Component, OnInit } from '@angular/core'; import { BehaviorSubject } from 'rxjs/BehaviorSubject'; interface AjaxRequest { url?: string; requestCount?: number; method?: string; } interface AjaxResponse { url?: string; requestCount?: number; response?: string; } @Injectable() export class HttpInterceptor { public ajaxStart = new BehaviorSubject<AjaxRequest>({}); public ajaxStop = new BehaviorSubject<AjaxResponse>({}); constructor() { this.bootstrapAjaxInterceptor(); } private bootstrapAjaxInterceptor() { const _self = this; const or...

ngClass does not update DOM in Promise Callback

I have a Rating Component (Angular) as follows: import { Component, ChangeDetectionStrategy, Input, NgZone, ApplicationRef} from '@angular/core'; import { Icon } from 'ionic-angular/components/icon/icon'; import { Events } from 'ionic-angular'; // import { ImageService } from '../../providers/image-service/image-service'; // @Component({ selector: 'rating', providers: [Icon], templateUrl: 'rating.html', changeDetection: ChangeDetectionStrategy.OnPush }) export class RatingComponent { static readonly RATING_CHANGE: string = 'ratings-changed'; text: string; private tempscore: number = 0; // @Input() public score: number = 0; @Input() public max: number = 5; @Input() public cardIndex: number = 0; @Input() public imageID: any = {}; @Input() public iconFull: string = 'md-thumbs-up'; constructor(private evts: Events, private imgService: ImageService, private ngZone: NgZone, private appR...

Realtime notification implementation in Laravel

I am developing an ERP using Laravel and Angulajrs, Now I want to implement real time notification in my application like facebook live notification, I have done bit research and I found socket.io is using to implement this, how can I use this in my laravel application? Or is there any other good approach to implement this? I am using windows for development and hosting in ubuntu. Please help to me reach in a good solution Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/20/realtime-notification-implementation-in-laravel/ via @lzomedia #developer #freelance #web #lzomedia.com

Step by step implementation of angular-gridster2

I am new to angular 4 and I need to implement angular-gridster2 here is the link https://github.com/tiberiuzuld/angular-gridster2 . Could anybody tell me which portion of code goes to which file … infact step by step implementation of angular-gridster2. thnku Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/20/step-by-step-implementation-of-angular-gridster2/ via @lzomedia #developer #freelance #web #lzomedia.com

Angular how can i get the input value of appended element

I have here my code of html basically its an color picker and a textbox when user pick a color i’m appending the value to the color hex texfield and user can add multiple colors i’m appending those two inputs when user click on add more it will add another set of two inputs but how do i get the colors that the user add and maybe push it to an array? Please help i would really appreciate it. Thankyou! <div class="add_items_color_container" id="colors"> <input type="text" readonly data-wheelcolorpicker="" data-wcp-preview="true" data-wcp-format="css" class="color"> <input type="text" class="color_hex"> </div> Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/20/angular-how-can-i-get-the-input-value-of-appended-element/ via @lzomedia #developer #freelance #web #lzomedia.com

Upload file to a directory using angularJs FileUploader

I’m uploading a file to a directory using a Web Service in Angular Js by using the module ‘FileUploader’. When i click on the button upload, the file is uploaded to the directory. When I upload a file again and the click on the button upload, the file is not uploaded. It seems like it is not being reset . This is the code in my controller : var uploader = vm.uploader = new FileUploader({ url: WS link, alias: 'file' }); // FILTERS // a sync filter uploader.filters.push({ name: 'syncFilter', fn: function (item, options) { return this.queue.length < 10; } }); // an async filter uploader.filters.push({ name: 'asyncFilter', fn: function (item, options, deferred) { setTimeout(deferred.resolve, 1e3); } }); // CALLBACKS uploader.onBeforeUploadItem = function (item) { }; uploader.onCompleteItem = function (fileItem, resp...

How to deploy automatically Laravel app with embedded Angular app to Heroku

I have a test app in GIT which has Laravel project and Angular SPA. I have webpack, which builds the angular app and copies its files to /public/ folder of Laravel. To build angular, I run command npm run build I have successfully deployed my laravel app to heroku but I am unable to deploy angular part correctly. I just need that during the deployment process on Heroku dyno it runs also a command like following cd angular-app && npm run build I have seen few tutorials and they talk about using nodejs server on Heroku. But I do not understand why I would need Node server on heroku when Nginx with Laravel will deliver all contents. I just need the angular app to be compiled. Is there a way to run build commands on PHP, Nginx, Laravel dyno in Heroku? Please help. My Procfile ( name of the file which Heroku uses ) is web: vendor/bin/heroku-php-nginx public/ Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/20/how-to-deploy-automaticall...

UI Select Match value for binding when performing UPDATE

I am trying to make an UPDATE window. If I bring the data with $scope.project_data, it works for the INPUT TYPE=”TEXT”. But, not for the UI-Select. I think I have to make some changes to UI-SELECT-MATCH. But, I am not sure how to bind the SQL data to UI-SELECT-MATCH on the instance when the window is brought up. [HTML] <!-- This works. --> <input type = "text" class = "form-control" ng-model = "project_data.project_title" id = "project_title" required/> <!-- This does NOT work. --> <ui-select ng-model = "project_customer_company.selected" theme="bootstrap" id="project_customer_company"> <ui-select-match></ui-select-match> <ui-select-choices repeat="customer in customers | filter: $select.search"> <div ng-bind-html="customer.customer_company_name | highlight: $select.search"></div> <div ng-bind-html="customer.custom...

Controller method on button click of custom directive ? angular js

I have my custom directive to upload file like this in parent html <uploading-multiple-files controlmodel="serviceProfile.serviceProfileAttachments" upload-all-action="uploadAll" delete-action="deleteImage" attachment-type-id="scopeTypeId" url="scopeUrl" enable-upload="enableUpload"></uploading-multiple-files> In parent controller the code for deleteAction is $scope.deleteImage = function (attachment) { alert(attachment.id); } my uploadAllAction is working now i want to implement deleteAction in similar way here is its implementation function uploadingMultipleFiles(FileUploader, $rootScope, $http, $filter, $window, browser) { return { replace: false, scope: { 'attachmentTypeId': '=?', 'controlmodel': '=', 'url': '=', 'maxsize': '=?', ...

Repeating twice in sum function

I have a function for total in data but it is repeating the result twice. anyone can help me? function groupBy(arr, key) { var newArr = [] , types = {} , newItem, i, j, cur; for (i = 0, j = arr.length; i < j; i++) { cur = arr[i]; if (!(cur[key] in types)) { types[cur[key]] = { type: cur[key] , data: [] }; newArr.push(types[cur[key]]); } types[cur[key]].data.push(cur); } return newArr; }; Array.prototype.sum = function (prop) { var total = 0 for (var i = 0, len = this.length; i < len; i++) { total += parseInt(this[i][prop]) } console.log(total); return total; } $scope.totalCreadit = function (st) { return st.sum(...

AngularJS – Why is ng-mouseleave not woking properly?

I’m posting my code, because for the sake of me, I can’t figure out why ng-mouseenter and ng-mouseleave are not working properly… They fire correctly only when the mouse enters and leaves from the side(left/right) and with the mouseleave still sometimes it doesn’t fire up.. I can’t use css to apply the needed classes, because I have to watch for a ctrl key press event, so I have to stick to the ng-mouseenter/leave. I tried also with ng-mouseover/out – they’re almost not working at all. Any idea why that is and how to fix it? I would be very thankful. view.html <div ng-controller="ControlCenterViewController as controlCenter"> <div class="controlcenter" ng-repeat="cat in controlCenter.categories"> <div class="controlcenter-category"></div> <div class="controlcenter-shortcut" ng-repeat="shortcut in cat.exts" ng-click="controlCenter.onSelect(shortcut, $event)" ng...

alert after click chip in materialize in Angularjs

I have the following chip with materialize: <div class="chip"> tag <i class="close material-icons" ng-click="hide_chip(this)">close</i> </div> my controller: $scope.hide_chip = function(elem){ var r = confirm("Are you sure?"); if (r == true) { var chip = elem.parentNode; chip.style.display = 'none'; } } I want to know how to show an alert when user clicks the close icon? the alert should have yes or no button if it is yes the chip close, but if user click no the chip does not close My error is “chip is undefined”, and when r is false the chip disappears Someone can help me? thanks Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/19/alert-after-click-chip-in-materialize-in-angularjs/ via @lzomedia #developer #freelance #web #lzomedia.com

form.$invalid is not working for angular ui date picker

i have two fields due date and a text filed enter a number due date which is a date picker ,either we can select date from date picker or we can set date by entering number in second text field. button create will be enabled if i manually set the date field from date picker but but it is not enabling if i set date picker value by entering text field can anybody tell me why this is happening. this is jsfiddle link fiddle Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/19/form-invalid-is-not-working-for-angular-ui-date-picker/ via @lzomedia #developer #freelance #web #lzomedia.com

AngularJS, Why my url show "#!" what happened? [duplicate]

This question already has an answer here: AngularJS: How to remove #!/ (bang prefix) from URL? 6 answers i used ui.router this is my code: Code this is my test result: Result Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/19/angularjs-why-my-url-show-what-happened-duplicate/ via @lzomedia #developer #freelance #web #lzomedia.com

How to unset a field in Mongoose with findByIdAndUpdate [duplicate]

This question already has an answer here: Mongoose overwrite the document rather that `$set` fields 2 answers I use MEAN stack. On my backend I use findByIdAndUpdate function in Mongoose to do the update operation in CRUD. I also use Bootstrap UI date picker. On “clearing” of the date, uib-datepicker-popup resets the scope value for the date field to undefined. Now I pass the scope resource object into Mongoose with a HTTP PUT angular $resource call, it won’t pass the null properties in the json object. My date field is simply missing and unpopulated in the json object and PUTting out. Therefore The original date stays and I failed to reset the date field in the MongoDB document. How should I approach deleting a certain field, then, as in unsetting with Mongoose built in “findByIdAndUpdate”? Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/19/how-to-unset-a-field-in-mongoose-with-findbyidandupdate-duplicate/ via @lzomedia #developer #freelanc...

Hover event in toastr angularjs

I use this library : https://github.com/CodeSeven/toastr . I want some event like ajax when I hover in toastr . I tried something like : $('#toastr-container).on('mouseenter',function(){ //do something }) toastr.info.on('mouseenter',function(){ //do something }) but no work . How can I do this . Please help me Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/19/hover-event-in-toastr-angularjs/ via @lzomedia #developer #freelance #web #lzomedia.com

Dynamic update style for Div tag using angular

<div id="" class="progress_bar_filled" style="width: 0%;"></div> i need to dynamic update style="width:0%" by using angular according to dynamic created div id as above id="" . i refer to below link no luck something missing Set style for a div using angular Scope value Thanks for help Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/19/dynamic-update-style-for-div-tag-using-angular/ via @lzomedia #developer #freelance #web #lzomedia.com

ng-include of inline SVG does not display gradient except in Chrome

I have setup an NG-INCLUDE which loads an SVG file that has classes “hover_color_change” so that the correct polygons can have their fill attribute updated: <div class="prod-illustration-div col s12 m8"> <div class="prod-svg-wrapper" ng-include="'/img/illustrations/illustration_' + productIdObj.illustration + '.svg'" onload="defaultFill(productIdObj.colors)"> </div> </div> I then have color swatches which trigger the $scope.hoverColorText() which calls the updateSVGFill() method to display the SVG fill matching the hover color and creates a shading of gradient so it’s not a solid color. Here is live link – WORKS IN CHROME In Chrome it works, however, in Safari, FF, Edge, it does not. I referenced this suggested answer which suggests referencing the ID attribute, which I believe I am already doing: $scope.defaultFill = function (colors) { if (colors) { var defaultCol...

how to merge multiple auto search fields into one in angular

MarketedProgramService.getMarketedPrograms().then(function( programs ) { $scope.programs = []; var userPrograms = $filter("filter")( programs, MarketedProgramService.userHasAccessToProgram.bind( null, UserProfile ) ); //userPrograms.unshift( defaultProgram ); // Exclude FirstComp/Maverick programs angular.forEach( userPrograms, function( program ) { if( program.mbu != "FC" ) { $scope.programs.push( program ); } }); }); Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/18/how-to-merge-multiple-auto-search-fields-into-one-in-angular/ via @lzomedia #developer #freelance #web #lzomedia.com

jQuery Datatable’s fnReloadAjax() equivalent in Angular UI Grid

I’m using a form to add data to the database and an Angular UI grid with pagination to show database data in the front. I want to reload the Angular UI gird every time I submit the form. In jQuery I have used , function submitForm() { . . /* form submitting process */ . $('#datatable').dataTable().fnReloadAjax(); // to reload table } In AngularJs I used , (as mentioned in this ) $scope.submitForm = function() { . . /* form submitting process */ . $scope.gridApi.core.refresh(); // to reload table } $scope.gridApi.core.refresh() is not working and it doesn’t give the expected result as fnReloadAjax(). I want to know how to get the fnReloadAjax() result in Angular UI grid further – here is my gridOptions code. $scope.gridOptions = { paginationPageSizes: [5, 10, 20], paginationPageSize: 5, columnDefs: [ {name: 'name', enableColumnMenu: false}, {name: ...

How to use function values for zingcharts in angularjs?

I have function for dynamically get the data and total for particular items. it is working fine. now i am trying to make a chart fro the data. var app = angular.module("app", ['zingchart-angularjs']);app.factory('itemsFactory', function ($http) { var factory = {}; factory.getItems = function () { return $http.get('.//davidstrans.json') }; return factory: }); app.controller('UsersTransController', function ($scope, itemsFactory) { itemsFactory.getItems().success(function (data) { $scope.users = data; $scope.items = groupBy($scope.users, "creditType"); $scope.valuesOne = []; $scope.aValues = [$scope.valuesOne]; }); this is the function for dynamically seperate the types; function groupBy(arr, key) { var newArr = [] , types = {} , newItem, i, j, cur; for (i = 0, j = arr.length; i < j; i++) { cur = arr[i]; if (!(cur[key] in types)) { types[cur[key]] = { ...

How I can share the value between two pages in ionic v-1

I am trying to add the value of both pages on selection. It is adding on individual pages. But while I am moving to the next page the Total value comes Zero. I am trying to add pass total added value from one page to another page. As I search , I found that there is a need to create a service controller to call a global scope value. <!-- page one view page --> <ion-content class="search-main padding"> <div class="list card"> <div class="item item-body no-padding stable"> <div class="row no-padding border-bottom" ng-controller="Ctrl3"> <div class="col padding border-right" ng-click="openDateCheckIn()"> <div class="margin-bottom-10" style="color:#0c60ee;"><i class="icon icon-money"></i> Total Value =></div> </div> <di...

Blob image display HTML using Angular.js

I stored image in MySQL with the blob datatype. Now I am getting response rs like 59e5dfa826ea3.png in Angular. How can I get rs to base64 like this using Angular: data/image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANIAAAAziVBORw0KGgoAAAANSUhEUgAAANIAAAAziVBORw0KGgoAAAANSUhEUgAAANIAAAAziVBORw0KGgoAAAANSUhEUgAAANIAAAAziVBORw0KGgoAAAANSUhEUgAAANIAAAAz. I stored in blob, image is HTML5 canvas sign image database. $http({ method: "GET", url: "xyx.php" }).then(function (response) { var data = response.data; var rs = data[0].img; }) Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/18/blob-image-display-html-using-angular-js/ via @lzomedia #developer #freelance #web #lzomedia.com

CORS issue between web/android/ios

when trying to $.ajax to fetch some content from other websites in my website, I got the error. Failed to load https://www.pinterest.com/ : No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘ http://localhost:8100 ‘ is therefore not allowed access. I knew if the target website didn’t allow localhost:8100 to fetch the data, I cannot fetch it in the client side on the web. However, I found that mobile app (not mobile browser, but android/ios application) does not have the issue, they can simply get the website content by their default mobile built-in HTTP get function. Do i want to ask why mobile will not encounter CORS issue (mobile can fetch the webcontent simply by the built-in http get function)? thanks. Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/18/cors-issue-between-webandroidios/ via @lzomedia #developer #freelance #web #lzomedia.com

bootstrap class=filestyle in ng-repeat angularjs 1.x

I have a form where in i have below code, where i need a file upload control for every object in ng-repeat along with drop down and label. Its rendering fine. For my file upload control, i am using bootstrap “filestyle” class to make it beautiful but the problem is that Filestyle class is not getting applied in ng-repeat. I know that we have limitation that ng-repeat does not apply css class on its elements easily. Can anyone help me with this as i need to apply class=filestyle on each file upload control. <table class="table table-striped"> <thead> <tr> <th style="width: 50%;">Files</th> <th style="width: 20%;">File Type</th> </tr> </thead> <tbody> <tr ng-repeat="file in allFiles"> ...

Show AngularJS Dropdown Multiselect checkeds

Image
I was made a simple dropdownList using AngularJS Dropdown Multiselect and II’d like to show in page the names Ids checkeds but it is showing only the IDs. How can I do It ? Below or in my GitHub code: GitHub : all code here to download Html page: index.html Angular app: “MyApp.js” DropDown directive: AngularJS Dropdown Multiselect Html page: index.html Angular app: “MyApp.js” Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/18/show-angularjs-dropdown-multiselect-checkeds/ via @lzomedia #developer #freelance #web #lzomedia.com

how can i dispaly mysql blob image inside html using angualrjs

using below php code i am store image in MySQL blob datatype.. now i am getting response like "59e5dfa826ea3.png" in angular.But how can i get this image "59e5dfa826ea3.png" to base64 like this using angular: data/image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANIAAAAzCAYAAADigVZlAAAQN0lEQVR4nO2dCXQTxxniVBORw0KGgoAAAANSUhEUgAAANIAAAAzCAYAAADigVZlAAAQN0lEQVR4nO2dCXQTxxnHiVBORw0KGgoAAAANSUhEUgAAANIAAAAzCAYAAADigVZlAAAQN0lEQVR4nO2dCXQTxxnH <?php list($type, $xp_signature) = explode(';', $xp_signature); list(, $xp_signature) = explode(',', $xp_signature); $data = base64_decode($xp_signature); $data = str_replace('data:image/png;base64,', '', $xp_signature); $data = str_replace(' ', '+', $data); $data = base64_decode($data); $file = uniqid() . '.png'; $success=file_put_contents($file, $data); ?> <img data-ng-src=""> Source: AngularJS ...

bind a table from an object in angular

i need to bind a table from an object in angular. when i submit my form i get the object and i send from component 1 to component 2, but when i create another object in my table only i see the last insert. HEre´s my code component n°2 import { Component, OnInit } from '@angular/core'; import { ClienteDetalleComponent} from './cliente-detalle.component'; import { FormGroup, FormControl, Validators } from '@angular/forms'; import {NgbDateStruct} from '@ng-bootstrap/ng-bootstrap'; import { Cliente } from '../../clases/cliente'; import { CoreService } from '../../services/core.service'; @Component({ selector: 'app-cliente-deuda', templateUrl: './cliente-deuda.component.html', styles: [] }) export class ClienteDeudaComponent implements OnInit { data: Cliente; constructor(private coreService: CoreService) {} ngOnInit() { this.data = this.coreServi...

How to return asyncronously return data from firebase to devextreme grid in angular 4

Good day, could you help me with the question? I’m trying to receive data from firebase to devextreme component. I’m using angular4. Here is the code of my html page: <dx-data-grid [dataSource]="priorities"> <dxi-column dataField="Priority"></dxi-column> </dx-data-grid> In the class of my component I receive the data from database this way: ngOnInit() { this.ds.list('priority').valueChanges().subscribe( data => { console.dir(data) for(var k = 0; k<data.length; k++){ var prior = new priority(); prior.Prioritie = data[k].toString(); this.priorities.push(prior); } console.dir(this.priorities);} where priorities is priorities: priority[] = []; I receive the data from the database and create all the priotiry objects, but my devextreme component shows “No data”. What do I need to do to get it filled? Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/17/ho...

(AngularJS) Routing with Dynamic Parameters

In the department.component.html view, I input a checkboxes per row, so users can select which department they would like to delete. <tr *ngFor="let department of departments ;trackBy: trackId"> <td> <input type="checkbox" (change)="getSelectedDepartmentID(department)" [checked]="department.checked" id="checkbox_" /> </td> </tr> <!-- this is the delete button --> <div class="row"> <div class="col-sm-4"> <button type="button" (click)="deleteSelectedDepartments()" replaceUrl="true" class="btn btn-danger btn-sm"> <span class="hidden-md-down" jhiTranslate="entity.action.delete...

angular moment date time picker timezone directive issue

The following code shows a date time picker in a form and i am using angular-moment-picker plugin as picker. When i pick a certain date/time it shows right time in the picker input box, but after the form is submitted the time entered in db is lagging behind. So i used a timezone directive from a stackoverflow answer. But it throws viewValue.getMinutes is not a function error <div moment-picker="startTime" class="form-control" name="startTime" ng-model="shiftTimings.startTime" format="YYYY-MM-DD HH:mm:ss" datepicker-localdate > </div> Directive app.directive('datepickerLocaldate', ['$parse', function ($parse) { var directive = { restrict: 'A', require: ['ngModel'], link: link }; return directive; function link(scope, element, attr, ctrls) { var ngModelController = ctrls[0]; ngModelCon...

Getting a Blank space in top of print Screen AnjularJS

I am working in AngularJS to Print invoice Page. Here i’m facing some issue. Getting a Blank space in top of print Screen enter image description here Here My Code HTML <div id="invoice" class="compact"> <div class="invoice-container"> <div class="card md-whiteframe-8dp printclass"> <div class="header"> <div class="invoice-date">10 October 2017</div> <div layout="row" layout-align="space-between stretch"> <div class="client"> <div class="invoice-number mb-8" layout="row" layout-align="start center"> <span class="title">PERFORMA INVOICE</span> <span class="number">PI50/2017</span> </div...

I am trying to execute multiple ng-repeat so that I can access a third level array in my json and display in a table but can’t get this working

I am trying to nest ng-repeat but looks like I am not doing it correctly. I need all the lineItem in the json to be displayed. Since, json value I am trying to display is a 3rd level array, I tried nested ng-repeat but does not work. <table border="1" width="100%"> <tr> <th>Id</th> <th>materialNumber</th> <th>quantity</th> </tr> <tbody ng-repeat="subConfig in values.subConfigs.subConfig"> <tr ng-repeat="lineItem in subConfig.lineItems.lineItem"> <td></td> <td></td> <td></td> </tr> </tbody> </table> here is jsfiddle I tried: Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/17/i-am-trying-to-execute-multiple-ng-repeat-so-that-i-can-access-a-third-level-array-in-my-json-and-display-in-a-table-but-cant-get-this-working/ via @lzomedia...

Angular ToDo App [on hold]

I am learning Angular, so I am trying to fully develop an Angular ToDo App that enables users to create, update and delete tasks, saving them into a Mongo database. The app is making progress, the angular logic works in the browser memory but I am having a hard time making it work with my Mongo database. Right now I can insert data into it through the “Create” state, but I can’t figure out how to retrieve the database data in order to display it in the “List” and “Completed” states of the App. Any experienced help is welcome, if anyone wants to take a look at the Github repository, it is: https://github.com/windsor80/Angular-Personal-Organizer Thank You! Source: AngularJS from Angular Questions https://angularquestions.com/2017/10/17/angular-todo-app-on-hold/ via @lzomedia #developer #freelance #web #lzomedia.com