How to Upgrade MySQL from 5.6 to 5.7 on CentOS 7

Here is my worked commands:

mysql -V
yum repolist all | grep mysql
sudo yum-config-manager --enable mysql57-community-dmr
sudo yum-config-manager --enable mysql57-community
sudo yum-config-manager --disable mysql56-community
yum repolist all | grep mysql
sudo yum install mysql-community-server
sudo service mysqld status
sudo service mysqld stop
sudo service mysqld start
mysql -V
sudo mysql_upgrade -u root -p --force
sudo service mysqld stop
sudo service mysqld start

 

This command is used for make your old user account can be upgraded to new version to be used.

sudo mysql_upgrade -u root -p –force

How to use css class in the innerHtml binding in angular

Credit goes to this link:

http://stackoverflow.com/questions/36265026/angular-2-innerhtml-styling

“Angular adds all kinds of CSS classes to the HTML it adds to the DOM to emulate shadow DOM CSS encapsulation to prevent styles of bleeding in and out of components. Angular also rewrites the CSS you add to match these added classes. For HTML added using [innerHTML] these classes are not added and the rewritten CSS doesn’t match.”

As a workaround try

  • for CSS added to the component
:host /deep/ mySelector {
  background-color: blue;
}
  • for CSS added to index.html
body /deep/ mySelector {
  background-color: green;
}

How to use jQuery in Angular 2

First install jQuery with NPM: npm install --save jquery

Update scripts key in your angular-cli.json to include jQuery

"scripts": [
  "../node_modules/jquery/dist/jquery.js"
]

You should stop angular-cli and rerun it using ng serve.

Now jQuery is available globally in the application. Whenever you need to use just declare $ or jQuery at the top like so:

import { Component, OnInit } from '@angular/core';  
// import line is this one
declare var $:any;
//declare var jQuery: any;

export default class Random implements OnInit {  
  ngOnInit() {
    // $ will be availble
    console.log($);
  }
}

 

jQuery THIS trap in Angular 2

Because of the access scope for jQuery, you must be careful when you use the jQuery in the  Angular. such as for this code  :

resultList  :string[] = [];
       myarray  :string[] = ['s1','s2','s3'];

       ............
                this.resultList.push('testS1');
                jQuery.each( this.myarray, function( index, v ) {
                        this.resultList.push(  v );
                });
       ...............

The error you will get will be :
Cannot read property ‘push’ of undefined

Correct way is:

       resultList  :string[] = [];
       myarray  :string[] = ['s1','s2','s3'];

       ............
                this.resultList.push('testS1');
                let __mythis = this;
                jQuery.each( this.myarray, function( index, v ) {
                        __mythis.resultList.push(  v );
                });
       ...............

How to pass data via event from child to parent component in Angular 2

At the child, I have a boolean data want to send to parent if a function method is clicked. What should I do?

Parent code is here. (onChangeDone) to receive an output from the child component and it can trigger a method to receive the event from the child too:

HTML Tag:
...

<childcomp (onChangeDone)="onChangeD($event)"> </childcomp>

....

TS code part:

export class ParentComp {

 onChangeD( result: boolean ) {
        if ( result ) // data changed
          { }
        else { }
    }


...

At the child component, answer is @Output() and together with the EventEmitter:

export class ChildComp implements OnInit {

    @Output() onChangeDone = new EventEmitter<boolean>();
    .....

    clickButton(): void {
     .....
     this.onChangeDone.emit(true);
     ....
    }

How to input a data from parent to child component in Angular 2

At the parent  I have a flag is createOrUpdate want to be sent to child component, parent code is here :

HTML Tag:
...

<childcomp [createOrUpdate]="createOrUpdate" > </childcomp >

....

TS code part:

export class ParentComp {
    createOrUpdate: boolean = true; // true for create, false for update
...

At the child component, answer is @Input  and same named variable to catch the input:

export class ChildComp implements OnInit {

    @Input() createOrUpdate: boolean;
    buttonText: string = 'Create New Car';
...
    ngOnInit() {
        if (this.createOrUpdate)
            this.buttonText = 'Create New Car';
        else this.buttonText = 'Update Car';
    }
....

 

How to create GUID or UUID in angular 2

There is a tool called angular2-uuid can do this:

npm install angular2-uuid --save

And in your code you can use it.

import { UUID } from 'angular2-uuid';
...
let uuid = UUID.UUID();

Angular – How to pass data by the router link

Refer to google page of https://angular.io/docs/ts/latest/guide/router.html#!#navigate ,

I just give a myself example to show how it works. This is a master component that wswapill guide the router to a component link of  /itemdetail  and together pass one object – this.selectedItemObj to next page. (selectedItemObj  could contain the itemName, id, etc. inside.)

import { Router} from '@angular/router';
....constructor(
        private router: Router
    )...
....this.router.navigate( ['/itemdetail', this.selectedItemObj] );
...

And then  at the target component, we can try to get the router link parameters at the init stage to initialize the data:

import { ActivatedRoute, Router, Params } from '@angular/router';
...
constructor(
        private route: ActivatedRoute,
        private router: Router
    ) {... }
...
ngOnInit() {
        this.route.params.subscribe(
            params => {
                this.itemName = params['itemName'];
                this.item = + params['id'];
                // TODO, you can call your service to get more data based on the ID or name 
                   ...
                });
..........

If you do not need to do too much things after you get the params data, you can use the switchMap to do a simple service call before subscribe, refer to google link for the example there.

CentOS 7 firewall basic

Wayne Zh

CentOS using firewalld ( not iptables) as firewall. It is a zone based firwall. By default, your network interface’s subnet will be add to trusted zone. You can use these command to check the status and setttings:

sudo systemctl status firewalld

sudo firewall-cmd --list-all-zones

Basic control and start

sudo systemctl disable firewalld
sudo systemctl enable firewalld
sudo systemctl start firewalld
sudo systemctl stop firewalld

If you want to add a subnet to trusted zone:

sudo firewall-cmd --permanent --zone=trusted --add-source=192.168.101.0/24
sudo firewall-cmd --reload
sudo firewall-cmd --list-all-zones