chore(docs): deprecation notices for methods and properties

Closes #15351

Author: petebacondarwin

docs/config/templates/ngdoc/api/module.template.html

@@ -5,33 +5,41 @@ <h1>
   {% if doc.title %}{$ doc.title | marked $}{% else %}{$ doc.name | code $}{% endif %}
 </h1>
 
-{% if doc.name != 'ng' and doc.name != 'auto' %}
-  <h2>Installation</h2>
+<h2>Installation</h2>
+{% if doc.installation or doc.installation == '' %}
+  {$ doc.installation | marked $}
+{% else %}
 
-  <p>First include {$ doc.packageFile | code $} in your HTML:</p>
-
-  {% code %}
-      <script src="angular.js"></script>
-      <script src="{$ doc.packageFile $}"></script>
-  {% endcode %}
-
-  <p>You can download this file from the following places:</p>
+  <p>First, get the file:</p>
   <ul>
     <li>
-      <a href="https://developers.google.com/speed/libraries/devguide#angularjs">Google CDN</a><br>
-      e.g. {$ ("//ajax.googleapis.com/ajax/libs/angularjs/X.Y.Z/" + doc.packageFile) | code $}
+      <a href="https://developers.google.com/speed/libraries/devguide#angularjs">Google CDN</a> e.g.
+      {% code %}"//ajax.googleapis.com/ajax/libs/angularjs/X.Y.Z/{$ doc.packageFile $}"{% endcode %}
+    </li>
+    <li>
+      <a href="https://www.npmjs.com/">NPM</a> e.g.
+      {% code %}npm install {$ doc.packageName $}@X.Y.Z{% endcode %}
     </li>
     <li>
-      <a href="http://bower.io">Bower</a><br>
-      e.g. {% code %}bower install {$ doc.packageName $}@X.Y.Z{% endcode %}
+      <a href="http://bower.io">Bower</a> e.g.
+      {% code %}bower install {$ doc.packageName $}#X.Y.Z{% endcode %}
     </li>
     <li>
-      <a href="http://code.angularjs.org/">code.angularjs.org</a><br>
-      e.g. {% code %}"//code.angularjs.org/X.Y.Z/{$ doc.packageFile $}"{% endcode %}
+      <a href="https://code.angularjs.org/">code.angularjs.org</a>
+      (discouraged for production use) e.g.
+      {% code %}"//code.angularjs.org/X.Y.Z/{$ doc.packageFile $}"{% endcode %}
     </li>
   </ul>
   <p>where X.Y.Z is the AngularJS version you are running.</p>
-  <p>Then load the module in your application by adding it as a dependent module:</p>
+
+  <p>Then, include {$ doc.packageFile | code $} in your HTML:</p>
+
+  {% code %}
+      <script src="path/to/angular.js"></script>
+      <script src="path/to/{$ doc.packageFile $}"></script>
+  {% endcode %}
+
+  <p>Finally, load the module in your application by adding it as a dependent module:</p>
   {% code %}
     angular.module('app', ['{$ doc.name $}']);
   {% endcode %}
@@ -51,7 +59,7 @@ <h2 id="known-issues">Known Issues</h2>
     <td>{$ issueDoc.id | link(issueDoc.name, issueDoc) $}</td>
     <td>
     {% for issue in issueDoc.knownIssues -%}
-      {$ issue | marked $}
+      {$ issue | marked $} {% if not loop.last %}<hr>{% endif %}
     {% endfor -%}
     </td>
   </tr>
@@ -61,6 +69,7 @@ <h2 id="known-issues">Known Issues</h2>
 {% endif %}
 
 
+{% if doc.componentGroups.length %}
 <div class="component-breakdown">
   <h2>Module Components</h2>
   {% for componentGroup in doc.componentGroups %}
@@ -81,6 +90,7 @@ <h3 class="component-heading" id="{$ componentGroup.groupType | dashCase $}">{$
   </div>
   {% endfor %}
 </div>
+{% endif %}
 
 {% if doc.usage %}
   <h2>Usage</h2>