angularjs random password generator at least one upper, lower, number and special character

How can I make this random password generator to generate at least one of the components? Currently, it happens that a number is not included in the generated password, or any of other types is left out. How to make it to generate at least of of the types?

        $scope.passwordLength = 12;
        $scope.addUpper       = true;
        $scope.addNumbers     = true;
        $scope.addSymbols     = true;

        $scope.createPassword = function(){
            var lowerCharacters = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z'];
            var upperCharacters = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];
            var numbers = ['0','1','2','3','4','5','6','7','8','9'];
            var symbols = ['!', '#', '$', '%', '&', '\'', '(', ')', '*', '+', ',', '-', '.', '/', ':', ';', '<', '=', '>', '?', '@', '[', '\\', ']', '^', '_', '`', '{', '|', '}', '~'];
            var finalCharacters = lowerCharacters;
            if($scope.addUpper){
                finalCharacters = finalCharacters.concat(upperCharacters);
            }
            if($scope.addNumbers){
                finalCharacters = finalCharacters.concat(numbers);
            }
            if($scope.addSymbols){
                finalCharacters = finalCharacters.concat(symbols);
            }
            var passwordArray = [];
            for (var i = 1; i < $scope.passwordLength; i++) {
                passwordArray.push(finalCharacters[Math.floor(Math.random() * finalCharacters.length)]);
            };
            $scope.password = passwordArray.join("");
        };