I would like to know the way for generating random id in angular template once the page loads. The problem I am facing is that every second I get different ID in the two spans. I want it to be the same on both places and dont want it to change its value every second. Here is my simple template:

<main class=has-header has-padding>

<div id = command>-ID:<span>{{vm.getRandomId()}}</span> -connect  -run</div>

    <hr>

<div id = command>-ID:{{vm.getRandomId()}}</div>

my controller:

'use strict';



(function() {

    angular

        .module('myApp')

        .controller('myController.ctrl', myController);



    myController.$inject = ['$scope'];



    function screenSharingCtrl($scope) {

        angular.extend(this, {

            getRandomId:getRandomId

        });



        function getRandomId() {

            return Math.floor((Math.random()*6)+1);

        }

    }

})();

Sorry if it is a duplicate question.
Any help is appreciated!
Thank you!