title: allow read special character in angular from url
body: <p>i have this url :</p>
  <pre><code>http://localhost:4200/auth/verify-checking/?email=kiadr93721477@gmail.com&amp;code=6XWK+4bpLA++2UfBr
  </code></pre>
  <p>in this url i have a params <code>code=6XWK+4bpLA++2UfBr</code> and in that url i have a special charcter like <code>+</code> .</p>
  <p>i read the params by this code :</p>
  <pre><code> constructor(private route: ActivatedRoute,
      private authService: AuthService,
      private router:Router) {
        this.route.queryParams.subscribe(params =&gt; {
          this.sendModel.email = params['email'];
          this.sendModel.code =  params['code'];
        });
    
    }
  </code></pre>
  <p>when i need to read the code and send it to server it send this code : <code>6XWK 4bpLA  2UfBr</code> but it must be like this <code>6XWK+4bpLA++2UfBr</code> and it replace the <code>+</code> by 'blank space' .</p>
  <p>i create a custome url serlizer but it not worked and still have that problem :</p>
  <pre><code>@Injectable()
  export class CustomUrlSerializer implements UrlSerializer {
    /** Parses a url into a {@link UrlTree} */
    private defaultSerializer: DefaultUrlSerializer = new DefaultUrlSerializer();
  
    /** Parses a url into a {@link UrlTree} */
    parse(url: string): UrlTree {
  
      // This is the custom patch where you'll collect segment containing '='
      const lastSlashIndex = url.lastIndexOf('/'), equalSignIndex = url.indexOf('=', lastSlashIndex);
      if (equalSignIndex &gt; -1) { // url contians '=', apply patch
        const keyValArr = url.substr(lastSlashIndex + 1).split('=');
        const urlTree = this.defaultSerializer.parse(url);
  
        // Once you have serialized urlTree, you have two options to capture '=' part
        // Method 1. replace desired segment with whole &quot;key=val&quot; as segment
        urlTree.root.children['primary'].segments.forEach((segment: UrlSegment) =&gt; {
          if (segment.path === keyValArr[0]) {
            segment.path = keyValArr.join('='); // Suggestion: you can use other unique set of characters here too e.g. '$$$'
          }
        });
  
        // Method 2. This is the second method, insert a custom query parameter
        // urlTree.queryParams[keyValArr[0]] = keyValArr[1];
        return urlTree;
      } else {
        // return as usual
        return this.defaultSerializer.parse(url);
      }
    }
  
    /** Converts a {@link UrlTree} into a url */
    serialize(tree: UrlTree): string {
      return this.defaultSerializer.serialize(tree);
    }
  }
  </code></pre>
  <p>and inject in provider in <code>core.module</code> :</p>
  <pre><code>    {
          provide: UrlSerializer,
          useClass: CustomUrlSerializer
      },
  </code></pre>
  <p><strong>whats the problem ? how can i solve this problem ????</strong></p>