Задайте параметры URL в angularjs

Я делаю приложение angularjs, и мне нужно нажать название компании пользователя на URL. Например, www.myapp.com/samsung или www.myapp.com/toyota.Задайте параметры URL в angularjs

Моей целью было получить первую информацию о компании и получить название компании и направить имя на URL-адрес, используя $ stateParams от ui-router.

Я могу нажать параметры, но это не меняет форму URL. URL-адрес остается таким же, как www.myapp.com.

Есть ли кто-нибудь, кто знает, как это выяснить? Благодаря

//main controller 
$rootScope.$on('$stateChangeSuccess', function (e, toState, toParams, fromState, fromParams) { 
toParams = {company: $scope.user.company.nickname};//$scope.user.company.nickname contains company's name 
}); 

//$stateProvider configuration 
$stateProvider 
.$state('home', { 
    url: '/:company', 
    ... 
    ... 
})

источник

2017-01-16 supergentle

Куда фрагмент кода – Laazo

Вы просто хотите добавить строку к URL-адресу? Загрузите состояние? Сделать все состояния с динамической строкой? – DevDig

Я собираюсь привязать строку названия компании к URL-адресу. Вот несколько примеров. www.myapp.com/samsung. www.myapp.com/samsung/posts/create. www.myapp.com/samsung/posts/view/hello. – supergentle

Если все, что вам нужно сделать, это изменить URL без перезагрузки страницы вы можете использовать:

var nameOfCompany = "toyota"; 
$location.url('/nameOfCompany');

$location является equvilant угловых по window.location он может быть использован для наблюдения и изменить URL без перезагрузки. Обратитесь к documentation за дополнительной информацией.

источник

2017-01-16 14:50:06 Callum

Я собираюсь подтолкнуть название компании ко всем другим URL-адресам динамически. – supergentle

@Supergentle ahh Я неправильно понял, насколько мне известно, это невозможно, вам понадобятся отдельные состояния для каждого названия компании или параметры, необходимые для указания URL-адреса, прежде чем перенаправляться в состояние не после. – Callum

Это печальные новости ... но я должен. Есть ли другой альтернативный способ достижения этого? – supergentle

UI-Router 1.0 и выше могут достигать этого с помощью переходного крюка .

Крючок проверяет, установлено ли значение параметра или нет. Если он не установлен (это null), он перенаправляет переход в одно и то же состояние, но с установленным значением параметра.

$stateProvider.state({ 
    name: 'company', 
    url: '/:companyName', 
    params: { companyName: null }, // default to null 
    onEnter: function ($transition$, $state, company) { 
     let params = $transition$.params(); 
     if (params.companyName === null) { // check if null. Get resolve and redirect 
     return $state.target("company", { companyName: company.name }); 
     } 
    }, 
    resolve: { 
     company: ($http) => 
      $http.get('company.json').then(resp => resp.data) 
    }, 
    component: 'company', 
    });

Вот рабочий plunker: http://plnkr.co/edit/aSJh6QyBUymKmaFNsOS8?p=info

источник

2017-01-16 17:12:13

Спасибо, это самый надежный ответ! Однако в моем коде «$ transition $» не распознается. Это происходит из другого пакета, кроме ui-router? – supergentle

Это в UI-Router 1.0 и выше –

Ну ... похоже, что мои исходные коды конфликтуют с версией 1.0. Я боюсь перестроить все свои коды, чтобы он работал. Кстати, я очень благодарен за ваш ответ. Это может быть действительно хороший ресурс, когда я буду делать подобный проект в будущем! – supergentle

я мог бы достичь того, что я хотел с UI-маршрутизатор 0.3x версии. Код может выглядеть грязным, но он работает, как я себе представлял. Надеюсь, это поможет кому-то, кто найдет ту же самую функцию.

.state('home', { 
    url: '/:company', 
    params: {company: null}, 
    templateUrl: '/templates/home.html', 
    onEnter: ['error', 'auth', '$state', 'company', '$stateParams', function (error, auth, $state,  company, $stateParams) { 
     if (!auth.isLoggedIn()) { 
      return error.flash('Login is required.', 'login'); 
     } 
     try { 
      if ($stateParams.company === null || $stateParams.company !== company.nickname) { 
       $state.go('home', {company: company.nickname});  
      } 
     } catch (err) { 
      console.log('mop'); 
     } 
    }], 
    resolve: { 
     company: ['auth', 'error', function (auth, error) { 
      return auth.getMyCompany().then(function (res) { 
       return res.data; 
      }, function (err) { 
       error.flash(401, 'login'); 
      }); 
     }], 
    }, 
})

источник

2017-01-18 16:16:06 supergentle

ответ

Смежные вопросы