title: How to add optional $stateParams using AngularJs ui-router?
body: <p>I want to add optional <code>$stateParams</code> to below <code>$state</code> ,Lets say currently i have <code>processId</code> and i want to add <code>assessmentId</code> as optional <code>params</code>. My goal is to launch same template and controller from two places in application and it will launch based on <code>$stateParams</code>.</p>
  
  <p>How can i achieve that task ?
  app.js</p>
  
  <p>Add Challenge</p>
  
  <pre><code>.state('app.addPrcChallenge', {
              url: '/add/prcChallenge',
              params: { processId: null,assessmentId:null},
              templateUrl: 'views/process/processChallenge.html',
              controller: 'ProcessChallengesCtrl',
              data: {
                  authenticate: true
              },
              resolve: {
               existingChallenge: function(){
                      return null;
                },
  </code></pre>
  
  <p>Edit Challenge</p>
  
  <pre><code>.state('app.editPrcChallenge', {
              url: '/edit/prcChallenge/:challengeKey/processId?/:assessmentId?',
              templateUrl: 'views/process/processChallenge.html',
              controller: 'ProcessChallengesCtrl',
              data: {
                  authenticate: true
              },
  </code></pre>