As the error message says, the sanitized HTML needs to be added using property binding: <p [innerHTML]=”massTimingsHtml”></p> constructor(private domSanitizer:DomSanitizer) { this.massTimingsHtml = this.getInnerHTMLValue(); } getInnerHTMLValue(){ return this.domSanitizer.bypassSecurityTrustHtml(this.parishDetail.mass_timings); } StackBlitz example (based on Swapnil Patwa’s Plunker – see comments below)
However, ideally I need another way, like the angular 1 $watch, as there are other ways my complex object can be changed, not just simple input fields I was working in a Google Autocomplete Component, and I was dealing with a similar issue: when the user types an address and select one from the Google … Read more
Unfortunately, there is no way to access SASS variable directly from typescript/javascript code. However, we can make a workaround to access those variables. Let me describe briefly the steps to access SASS variables from within typescript source code: 1. Creating a SASS Helper Component Create ../providers/sass-helper/sass-helper.component.scss: $prefix: “–“; //Prefix string for custom CSS properties //Merges … Read more
You can get the keys from an object using Object.keys (requires polyfill in IE AFAIK) import { Pipe, PipeTransform } from ‘@angular/core’; @Pipe({ name: ‘keys’ }) export class KeysPipe implements PipeTransform { transform(value): any { if(!value) return null; return Object.keys(value); } } <div *ngFor=”let key of member | keys”>{{member[key]}}</div> For Angular 6 see How to … Read more
EDIT: What about using persistent=”true” in your ion-menu item? Like you can see in Ionic2 docs: Persistent Menus Persistent menus display the MenuToggle button in the NavBar on all pages in the navigation stack. To make a menu persistent set persistent to true on the element. Note that this will only affect the MenuToggle button … Read more
The view is loaded before billItem is set. You could use a safe navigation operator ?. <ion-input text-right type=”text” [value]=”billItem?.BillNo” readonly></ion-input> //billItem model has BillNo property or set it to empty object in the constructor of bill-details.ts: constructor(…){ if(! this.billItem){ this.billItem={} } }
Here’s how I did it: In every Page component, I created a function called backButtonAction(), which will execute custom code for every page. Code: import { Component } from ‘@angular/core’; import { Platform, NavController, ModalController } from ‘ionic-angular’; import { DetailsModal } from ‘./details’; @Component({ selector: ‘page-appointments’, templateUrl: ‘appointments.html’ }) export class AppointmentsPage { modal: … Read more
This is a basic error of angular. You can see the issue here. So the answer that is accepted till now is use share module. You can do like this: – Create a share.module.ts – Import, declaration and export your component in this share.module.ts import { NgModule } from ‘@angular/core’; import {SharedComponentA} from “./SharedComponentA”; import … Read more