How to make jade friends with angular.js?

Question

Angular

Hello,
I am currently learning node.js, express and angular.js. I want to use these technologies to implement a SPA site, but for some reason Angular.js with Jade does not work for me.
Tell me, please, how you can make them friends and I'm interested in another question regarding links. As I understand it, the URL is not passed to the server for processing, and Angular.js takes care of everything if you use its routing. Is it possible to implement working links with Angular.js?
layout.jade

html(ng-app)
   head
      title
      link(rel="stylesheet", href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css")
      link(rel='stylesheet', type="text/css", href='/css/style.css')
      script(src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js")
   body
      .navbar.navbar-default
         .container
            ul.nav.navbar-nav
               li
                  a(href='/') home
               li
                  a(href='/chat') chat
       block content

index.jade

extends layout

block content

   .container
      h1 Hello from index page!

      input(type='text', ng-model="word") {{ word }}

Answer 1

In this case, you should look at Jade as normal html
The difference is only in the syntax, the output is the same html
the input has no text and you get the following

input(type='text', ng-model="word") {{ word }}
<input type='text'  ng-model="word"></input> {{ word }}

You need to use value

input(type='text', ng-model="word", value="{{ word }}") 
<input type='text'  ng-model="word" value="{{ word }}"></input>

Answer 2

On the server side during assembly and packaging.
I usually used gulp-angular-templatecache and gulp-jade respectively.