Question

HTML：

<!-- Order -->
<li ui-sref-active="active">
    <a ui-sref="order" class="main_link">
        <i class="fa fa-shopping-cart"></i>Order
    </a>
    <a ui-sref="order/create"><span class="plus">+</span></a>
    <div class="clearfix"></div>
</li>

我想在class="active"上添加<li>。

每当点击<a ui-sref="order/create"><span class="plus">+</span></a>时，class="active"加上<li>。

BUT

点击 <a ui-sref="order" class="main_link"><i class="fa fa-shopping-cart"></i>Order</a> class="active"时间<li>未添加getBigDecimal。

我们将不胜感激。

Answer 1

当前实施ui-router的方式是不可能的。您无法指定将ui-sref激活ui-sref-active的特定ui-sref-active。话虽这么说，调整模板以包装这些链接应该更容易，每个ui-sref可以有一个ui-router。至少比调整public class AlternativeExecutorService { private final CopyOnWriteArrayList<ListenableFutureTask> futureQueue = new CopyOnWriteArrayList(); private final ScheduledThreadPoolExecutor scheduledExecutor = new ScheduledThreadPoolExecutor(1); // used for internal cleaning job private final ListeningExecutorService threadExecutor = MoreExecutors.listeningDecorator(Executors.newFixedThreadPool(5)); // used for private ScheduledFuture scheduledFuture; private static final long INTERNAL_JOB_CLEANUP_FREQUENCY = 1000L; public AlternativeExecutorService() { scheduledFuture = scheduledExecutor.scheduleAtFixedRate(new TimeoutManagerJob(), 0, INTERNAL_JOB_CLEANUP_FREQUENCY, TimeUnit.MILLISECONDS); } public void pushTask(OwnTask task) { ListenableFuture<Void> future = threadExecutor.submit(task); // -> create your Callable futureQueue.add(new ListenableFutureTask(future, task, getCurrentMillisecondsTime())); // -> store the time when the task should end } public void shutdownInternalScheduledExecutor() { scheduledFuture.cancel(true); scheduledExecutor.shutdownNow(); } long getCurrentMillisecondsTime() { return Calendar.getInstance().get(Calendar.MILLISECOND); } class ListenableFutureTask { private final ListenableFuture<Void> future; private final OwnTask task; private final long milliSecEndTime; private ListenableFutureTask(ListenableFuture<Void> future, OwnTask task, long milliSecStartTime) { this.future = future; this.task = task; this.milliSecEndTime = milliSecStartTime + task.getTimeUnit().convert(task.getTimeoutDuration(), TimeUnit.MILLISECONDS); } ListenableFuture<Void> getFuture() { return future; } OwnTask getTask() { return task; } long getMilliSecEndTime() { return milliSecEndTime; } } class TimeoutManagerJob implements Runnable { CopyOnWriteArrayList<ListenableFutureTask> getCopyOnWriteArrayList() { return futureQueue; } @Override public void run() { long currentMileSecValue = getCurrentMillisecondsTime(); for (ListenableFutureTask futureTask : futureQueue) { consumeFuture(futureTask, currentMileSecValue); } } private void consumeFuture(ListenableFutureTask futureTask, long currentMileSecValue) { ListenableFuture<Void> future = futureTask.getFuture(); boolean isTimeout = futureTask.getMilliSecEndTime() >= currentMileSecValue; if (isTimeout) { if (!future.isDone()) { future.cancel(true); } futureQueue.remove(futureTask); } } } class OwnTask implements Callable<Void> { private long timeoutDuration; private TimeUnit timeUnit; OwnTask(long timeoutDuration, TimeUnit timeUnit) { this.timeoutDuration = timeoutDuration; this.timeUnit = timeUnit; } @Override public Void call() throws Exception { // do logic return null; } public long getTimeoutDuration() { return timeoutDuration; } public TimeUnit getTimeUnit() { return timeUnit; } } }行为更容易。

Answer 2

app.js

var app = angular.module('plunker', ['ui.router']);

app.config([ '$stateProvider', '$urlRouterProvider',
        function($stateProvider, $urlRouterProvider) {
            $urlRouterProvider.otherwise("/home/flow");
            $stateProvider.state("home", {
                url : '/home',
                templateUrl : 'home.html',
            }).state("contact", {
                url : '/contact',
                template : 'contact',
            });
        }]);
app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
});

的index.html

<!DOCTYPE html>
<html ng-app="plunker">

<head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>
  <script>
    document.write('<base href="' + document.location + '" />');
  </script>
  <link rel="stylesheet" href="style.css" />
  <script data-require="angular.js@1.2.x" src="https://code.angularjs.org/1.2.28/angular.js" data-semver="1.2.28"></script>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.js"></script>
  <script src="app.js"></script>
</head>

<body ng-controller="MainCtrl">
  <p>Hello {{name}}!</p>
  <li class="top" ui-sref-active="heaader_active">
    <a ui-sref="home"><i class="fa fa-cloud-upload"></i>&nbsp;Home</a>
        <a ui-sref="contact"><i class="fa fa-cloud-upload"></i>&nbsp;contact</a>                            
    </li>
  <ui-view/>
</body>

</html>

的style.css

/* Put your css in here */

.heaader_active {
    background: red;
}

更多细节检查Here

AngularJS - Multiple＆＃39; ui-sref＆＃39;在单个＆u; sref-active＆＃39;

2 个答案: